2017-11-05 2 views
0

mir eine catalog.html Winkel Anwendung, in 2 ui Ansichten und sie unter der gleichen Controller categoryCtrl:Ui-Ansicht nicht aktualisiert Werte von Controller

catalog.html

<!-- SEARCH -->   
<div ui-view="search-catalog"></div> 
<!-- CONTENT -->    
<div ui-view="result"></div> 

app.js

.state('catalog', { 
url: '/catalog', 
views: { 
    'search-catalog': { 
     templateUrl: 'views/search-catalog.html', 
     controller: 'categoryCtrl' 
    }, 
    'result': { 
     templateUrl: 'views/result.html', 
     controller: 'categoryCtrl' 
    }, 

Wenn ich etwas in search-catalog und kann s ändern ee ändert sich innerhalb von categoryCtrl, die Änderungen werden nicht in result widergespiegelt. Insbesondere habe ich ein Array $ scope.items und ng-repeat nicht aktualisiert seine Werte

Antwort

1

Wie sagte der categoryCtrl mit zwei getrennten Bereichen dupliziert, also wenn Sie Objekt in dem Such-Katalog Umfang scope.items $ ändern wird nicht in Ergebnis Umfang widerspiegeln. Wenn Sie nicht die Logik auf dem übergeordneten Bereich ausmacht (Katalog) zu bewegen tun Sie könnten auch die folgenden:

.state('catalog', { 
    url: '/catalog', 
    views: { 
     '': { 
     templateUrl: 'catalog.html', 
     controller: 'catalogCtrl' 
     }, 

     '[email protected]': { 
     templateUrl: 'views/search-catalog.html'    
     }, 

     '[email protected]': { 
     templateUrl: 'views/result.html'    
     } 
    } 
.controller("catalogCtrl", function($scope) { 
    $scope.items = ["item1", "item2", "item3"]; 
    }); 

In diesem Fall sind die verschachtelten Ansichten werden auf den gleichen Controller gebunden werden /Umfang. Wenn Sie die Logik zwischen Ihren verschachtelten Sichten und dem übergeordneten Element trennen möchten, sollten Sie ein Singleton wie einen Service oder eine Factory verwenden und dieses in Ihre verschachtelten Sichten einfügen.

+0

Danke, ich werde versuchen Ihre Lösung und werde wissen lassen –

+0

Es lohnt sich hinzuzufügen, dass ich ui-Ansichten in 'catalog.html' setzen musste –

0

AngularJS erstellt 2 verschiedene Instanzen Ihres Controllers, so dass beide Controller Bereiche haben. Die Änderungen, die Sie an einem von ihnen vornehmen, spiegeln sich nicht in dem anderen wider.

Es gibt verschiedene Möglichkeiten, um das zu erreichen, wonach Sie suchen. Sie können den Code, der geteilt werden soll, in einen übergeordneten Controller einfügen oder eine Factory (Singleton) erstellen, um die Daten zwischen beiden Controllern zu teilen.

Sie können auch Ereignisse (Broadcast, emit, on) verwenden, um Controller zu kommunizieren.

Verwandte Themen