动态更新范围变量。角

时间:2017-08-11 18:33:49

标签: javascript angularjs

我有以下内容:

HTML

<div class="panel panel-default" ng-controller="firstController">
    <ul id="conversation">
        <li ng-repeat="msg in messages">{{msg}}</li>
    </ul>
</div>

JS

var messages = [];
//Messages is updated everytime a message is sent.

var firstController = function($scope) {
    $scope.messages = messages;
}

app.controller("firstController", firstController);

我有一个更新全局javascript消息变量的按钮。每次单击按钮时,我都需要更新$ scope messages变量。我的控制器仅在页面首次加载时运行。 如何更新$ scope变量?

1 个答案:

答案 0 :(得分:0)

按照建议,只要单击按钮,就可以在控制器中使用ng-click invoke函数。您可以更新功能中的messages array

以下是有关如何执行此操作的代码示例。您可以查看此Fiddle以查看其实际效果。

<div id="appContainer" ng-app="MyApp">
  <div ng-controller="MyController">
  <button ng-click="updateMessages();">Click Me</button>
    <div ng-repeat="msg in messages">
      <label>{{msg}}</label>
    </div>
  </div>
</div>


var app = angular.module('MyApp', []);

app.controller('MyController', ['$scope', function($scope) {
  $scope.messages = [];
    $scope.updateMessages = function() {
    $scope.messages.push('Date is: ' + new Date().toString());
  };
}]);