Jak kierować określone elementy UI-widocznym zagnieżdżone UI-widoki istnieć

Wyobraźmy sobie jakiś html następująco:Jak kierować określone elementy UI-widocznym zagnieżdżone UI-widoki istnieć

<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>

Korzystanie UI-routera, czy jest jakiś sposób aby kodować stan, który będzie ustawiony „Dave”, aby nowy fragment HTML, pozostawiając wszystko inne nietknięte.

np. Chciałbym to zrobić:

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

Nie mogę go uruchomić. Powodem, dla którego chcę to zrobić, jest to, że czasami chciałbym zastąpić "Dave'a" częściową aktualizacją, innym razem chciałbym zastąpić całą "monty" częściową aktualizacją. Wygląda na to, że ui-router nie lubi zagnieżdżania widoków ui w tym samym fragmencie kodu HTML.

Źródło

2016-05-18 whatdoesitallmean

twój stan „daveonly” powinno być zagnieżdżone wewnątrz państwa „Monty” i należy nazwać tylko dave widok Dave @ Monty ' – MayK

lubię tego ?: $ stateProvider .stan ('Monty', { url: "/ Monty", odsłon: { '': {Szablon: "Nie potrzebujemy tego"} } }) .state ('monty.daveonly' { url: "/ Dave", odsłon: { Dave @ Monty ': {szablon: "Dave ma teraz content"} } }) – whatdoesitallmean

w 'monty.daveonly' należy dodać nadrzędny: 'Monty' – MayK

Z jednego punktu widzenia chciałbym zaproponować:

ruch kod HTML do plików '.tpl.html'
stosowanie 'templateUrl' zamiast 'szablonu'

i sprawdzić, czy po to odpowiedni dla Ciebie:

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

Spójrz na page1 i page2, aby uzyskać więcej informacji.

Jednak z innego punktu widzenia bardziej przydatne może być użycie tylko jednego interfejsu użytkownika i przeprojektowanie bieżących widoków interfejsu użytkownika, aby stały się odpowiednimi dyrektywami dla kontrolerów/usług: używanie dyrektyw z kontrolerami/usługami może pomóc w zarządzaniu częściowe ponowne ładowanie i zapisanie testów jednostkowych.

Źródło

2016-05-21 11:10:02 marbug

Tak, można to zrobić łatwo za pomocą abstrakcyjnych stanów i tak, masz rację, ui-router nie lubi bezpośrednich widoków zagnieżdżonych bezpośrednio, ale działa dobrze, jeśli widoki są w dowolnym szablonie podrzędnym.

Teraz rozważmy stronę główną (index.html)

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

Ten szablon, który pojawi się w tej nienazwanej widzenia. (Parent.html)

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

Teraz plik 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' 
    } 
    } 
});

(teraz część manipulacji)

(child1.html) 

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

teraz child1viewchange.html padega PE jana i WO dekhne Wali hai kaunsi kaisi thi/...... (child1viewchange.html)

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

Teraz, gdy klikniemy przycisk w widoku podrzędnym1, zawartość pierwszego widoku zmieni się i jeśli przypiszemy kontrolery, wtedy będą mogli wykorzystać je do kontroli danych.

Źródło

2016-05-23 18:23:29 Rohan

dzięki bardzo. Rozumiem, że mogę robić to, co sugerujesz, ale chcę w szczególności wykorzystać początkową zagnieżdżoną strukturę ui-view pokazaną w moim pierwszym poście. Następnie chcę to ekstrapolować w wielu kierunkach, celując w dowolne widoki bez konieczności wymuszania całego mechanizmu na wiele "obciążeń", które tylko wstrzykują pojedynczą hierarchię widoków Ui. Czy to po prostu niemożliwe? Wydaje się to dużym zaniedbaniem z możliwości routera. – whatdoesitallmean

Przypuszczam, że to też jest wielkie zaniedbanie! Jeśli napotkam jakieś zmiany w tym konkretnym zagadnieniu, dam ci znać !!!! – Rohan

Jak kierować określone elementy UI-widocznym zagnieżdżone UI-widoki istnieć

Odpowiedz

Powiązane problemy