Come bersaglio specifici elementi ui vista quando annidati ui-viste esistono

immaginare qualche html come segue:Come bersaglio specifici elementi ui vista quando annidati ui-viste esistono

<body ng-app="blocksApp"> 

Some content goes here 

<div ui-view="monty"> 

    <div ui-view="dave">Aaa</div> 
    <div ui-view="pete">Bbb</div> 
    <div ui-view="steve">Ccc</div> 

</div> 

</body>

Utilizzando ui-router, c'è un modo per codificare uno stato che imposterà "Dave" per un nuovo frammento di html, lasciando intatto tutto il resto.

ad es. Vorrei fare questo:

$stateProvider 
     .state('daveonly',{ 
      url: "/dave", 
      views:{ 
       'dave':{template:"Dave now has content"} 
      } 
     })

Non riesco a farlo funzionare. La ragione per cui voglio farlo è che a volte mi piacerebbe sostituire "Dave" con un aggiornamento parziale, altre volte vorrei sostituire l'intero "monty" con un aggiornamento parziale. Sembra che l'ui-router non ami avere nidificazioni ui nello stesso snippet di html.

fonte

2016-05-18 whatdoesitallmean

tuo stato 'daveonly' deve essere nidificato all'interno dello stato 'monty' e si dovrebbe assegnare un nome al dave solo vista 'dave @ monty' – MayK

Ti piace questa ?: $ stateProvider .Stato ('Monty', { url: "/ monty", vista: { '': {template: "Non hanno bisogno di questo"}} }) .state ('monty.daveonly', { url: "/ Dave", vista: { 'dave @ monty': {template: "Dave ora ha un contenuto"}} }) – whatdoesitallmean

in 'monty.daveonly' si dovrebbe aggiungere genitore: 'Monty' – MayK

Da un certo punto di vista mi piacerebbe suggerire:

mossa codice html in file '' .tpl.html
uso 'TemplateURL' invece di 'template'

e verificare se quanto segue è adatto per voi:

$stateProvider.state("daveonly", { 
    views: { 
     "dave": { 
      templateUrl: 'daveonly.tpl.html', 
     }, 
     "pete": { 
      templateUrl: 'pete.tpl.html', 
     }, 
     "steve": { 
      templateUrl: 'steve.tpl.html', 
     },   
    }  
});

Date un'occhiata a page1 e 01.235.per ulteriori dettagli.

Ma da un altro punto di vista potrebbe essere più utile utilizzare solo una vista ui e riprogettare le attuali viste ui per diventare direttive appropriate con controllori/servizi: l'utilizzo di direttive con controller/servizi potrebbe aiutare a gestire ricarica parziale correttamente e per scrivere test unitari.

fonte

2016-05-21 11:10:02 marbug

Sì, può essere fatto facilmente con l'aiuto di stati astratti e sì, si è corretto, il router non ama le viste nidificate dirette ma funziona correttamente se le viste sono in qualsiasi modello secondario.

Ora consideriamo questa pagina principale (index.html)

<body ng-app="app"> 
<div ng-view=""></div> 
</body>

Ora questo modello che apparirà in questa vista senza nome. (Parent.html)

<h3>This is the parent template</h3> 
<div ng-view="child1"></div> 
<div ng-view="child2"></div>

Ora il file JS

$stateProvide.state('home',{ 
    url:'/', 
    abstract:true, 
    views:{ 
    "":{ 
     templateUrl:'parent.html' 
    } 
    } 
}) 
.state('home.child',{ 
    url:"", 
    views:{ 
    '[email protected]':{ 
     templateUrl:'child1.html' 
    }, 
    '[email protected]':{ 
     template:'Child2' 
    } 
    } 
}) 
.state('home.child.child1',{ 
    url:"[email protected]", 
    views:{ 
    '[email protected]':{ 
     templateUrl:'child1viewchange.html' 
    } 
    } 
});

(Ora la parte manipolazione)

(child1.html) 

<button ui-sref="home.child.child1">Child</button>

Ora child1viewchange.html pe Jana padega e wo dekhne wali hai kaunsi Kaisi thi/...... (child1viewchange.html)

<h3>Child1's view change</h3>

Così ora, quando clicchiamo sul pulsante in visualizzazione figlio1, il contenuto nella prima vista cambia e se assegniamo i controller, possono usarli per controllare i dati.

fonte

2016-05-23 18:23:29 Rohan

grazie molto. Capisco che posso fare ciò che mi suggerisci, ma in particolare voglio sfruttare la struttura di visualizzazione ui nidificata iniziale mostrata nel mio post iniziale. Poi voglio estrapolarlo in un certo numero di direzioni, orientando l'interfaccia utente a piacimento senza dover forzare l'intero meccanismo in molti "carichi" che iniettano sempre una sola gerarchia di viste ui. È semplicemente impossibile? Sembra una grande omissione dalle capacità di ui-router. – whatdoesitallmean

Suppongo che anche questa sia una grande omissione! Se mi imbatto in sviluppi in questo specifico problema, ti farò sapere !!!! – Rohan

Come bersaglio specifici elementi ui vista quando annidati ui-viste esistono

risposta

Problemi correlati