2016-05-18 7 views
0

Ich habe eine Variable in meinem Controller und möchte später einen Wert zuweisen, wenn Sie auf eine Schaltfläche klicken.Kann ich eine Variable instanziieren, aber später einen Wert zuweisen?

dh
var app = angular.module('myApp', ['ngRoute']);  

.... 

var userArray = [ 
    {name: "John", age: 25}, {name: "Jim", age: 30} 
]; 

app.controller('Page2Controller', function($scope) { 
    $scope.message = 'Look! I am from page 2.'; 
    $scope.newArray = []; 

    $scope.addUsers = function(){ 
     scope.newArray = userArray; 

     console.log($scope.newArray); 
    } 
} 

app.config(function($routeProvider) { 
    $routeProvider 

    .when('/page2', { 
     templateUrl : 'pages/page2.html', 
     controller : 'Page2Controller' 

    ... 

page2.html

<div> 
    <p>{{ message }}</p> 

    <ul> 
     <li ng-repeat="user in Page2Controller.newArray">{{user.name}}</li> 
    </ul> 
</div> 

index.html

<body ng-controller="MainController"> 
    <div id="sideMenu"> 
     <h2>Campaign</h2> 

     <ul> 
      <li><a href="#">Home</a></li> 
      <li><a href="#page2">Page 2</a></li> 
      <li><a href="#page3">Page 3</a></li> 
      <li><a href="#page4">Page 4</a></li> 
     </ul> 
    </div> 

    <div ng-view></div> 
</body> 

Ich verstehe nicht, warum die $ scope.user in der Konsole angezeigt wird, aber in HTML-Seite der „ng -repeat "zeigt die Benutzer nicht an. Kann es sein, dass ng-repeat keine dynamisch hinzugefügten Daten anzeigen kann?

Kann mir jemand helfen? Ich weiß es zu schätzen.

+2

Sie haben dies: 'scope.newArray = userArray;' und ich denke, es wäre besser, das '$' Zeichen '$ scope.newArray = userArray;' – MysterX

Antwort

1

Sie nie diese Funktion namens I .. erraten

var app = angular.module('myApp', []);  
var userArray = [{name: "John", age: 25}, {name: "Jim", age: 30}]; 
app.controller('Page2Controller', function($scope) { 
    $scope.message = 'Look! I am from page 2.'; 
    // $scope.newArray = []; 
    $scope.addUsers = function(){ 
     $scope.newArray = userArray; 
     console.log($scope.newArray); 
    } 
    $scope.addUsers(); 
}); 

und html

<div ng-controller="Page2Controller"> 
         <p>{{ message }}</p> 

         <ul> 
          <li ng-repeat="user in newArray">{{user.name}}</li> 
         </ul> 
        </div> 

Ich habe verwendet statisch Ihren Controller als ich die ngRoute nicht umgesetzt habe.

+0

Hallo, danke für Ihre Antwort. Es deutete auf die richtige Antwort hin. Anstelle von ng-repeat = "user in Page2Controller.newArray" habe ich ng-repeat = "user in newArray" gemacht und es funktioniert jetzt. – Octtavius

+0

Es wäre gut, dass Sie meine Antwort als richtig markieren dann .. –

1

Versuchen Wechsel zu:

<li ng-repeat="user in scope.newArray">{{user.name}}</li> 

Ich glaube nicht 'Page2Controller' in der Vorlage Kontext bekannt ist.

0

Zunächst einmal müssen Sie haben eine ng Sie auf derective, wo Sie wie

<button type="button" ng-click="asigningValue()"></button> 

dann in Ihrem Controller klicken haben müssen Sie zuweisen, was Sie wollen, wie in Controller Danach Sie Bedarf haben binden Sie zeigen Wert in der Richtlinie wie

app.controller('Page2Controller', function($scope) { 
$scope.asigningValue=function(){ 
    $scope.message = 'Look! I am from page 2.'; 
    } 
} 

Dann using-Direktive als

Bindung unter Verwendung von Daten zuordnen
<p ng-bind-html="message"></p> 

Hoffe, es wird hilfreich sein!

Vielen Dank!