如何使用ControllerAs語法手動更新AngularJS視圖？

我正在開發具有可排序，可停靠，可浮動小部件的儀表板。我使用的一個控件在關閉body標記之前，在DOM的底部生成浮動窗口小部件作爲HTML。這有效地消除了從控制器範圍中生成的窗口控件中執行的操作。如何使用ControllerAs語法手動更新AngularJS視圖？

我正在使用controllerAs語法開發此儀表板控制器，但我無法弄清楚如何使用此語法有效更新視圖當外部組件執行影響視圖數據的操作時？

注意：這不是我唯一面臨的，迫使我手動更新主視圖。頁面上的其他位置也有指令執行影響視圖的操作。

理想情況下，我不需要手動更新視圖，因爲我將使用內置的Angular命令中影響摘要循環的所有命令 - 但這不是我的選擇。

所以...如果我用$scope我將能夠簡單地做：

$scope.$digest

或者

$scope.$apply

但是我怎麼實現同樣影響使用控制器？

var vm = this; 
vm.array = [item, item]; 
vm.something = something; 

//External something changes something on a vm.variable 

vm.update! //How??

來源

2014-12-02 Blunderfest

使用'as'時，您正在定義您將查看控制器範圍的方式。

所以這個：

<body ng-controller="MainCtrl"> 
    <p>Hello {{name}}!</p> 
</body> 

app.controller('MainCtrl', function($scope) { 
    $scope.name = 'World'; 
});

等於這樣的：

<body ng-controller="MainCtrl as main"> 
    <p>Hello {{main.name}}!</p> 
</body>

你的控制器：

app.controller('MainCtrl', function($scope) { 
    this.name = 'World'; 
});

DEMO

所以基本上你應該能夠ŧ o請撥打this.$digest或this.$apply，正如您在$scope上所做的那樣。

UPDATE

做一些搜索之後，我認爲正確的解決辦法應該使用$scope.apply()或$scope.digest()。

主要資源：
AngularJS’s Controller As and the vm Variable
有a comment上升你同樣的問題，筆者重播：

You can use $scope.$apply() in that case and just inject $scope for that purpose (still using vm for everything else). However, if you switch fro using ajax to using Angular's $http, then you won't need to call $apply as angular's $http does that for you. That's what I recommend

我發現其他資源：

來源

2014-12-02 18:45:34 pasine

使用'變種vm = this;'然後'vm。$ digest（）;'導致錯誤：'對象不支持屬性或方法'$ digest''。 – Blunderfest 2014-12-02 18:58:39

在這種情況下，我認爲你需要使用'$ scope。$ digest（）'或'$ scope。$ apply（）'。看看[這篇文章]（http://www.johnpapa.net/do-you-like-your-angular-controllers-with-or-without-sugar/），它解釋了「$ scope」注入 – pasine 2014-12-02 19:44:28

我之前閱讀過這篇文章，並且我認爲它特別提到了$ scope的注入方式，以引用手錶或廣播，這讓我認爲可能有一種方法可以在沒有範圍的情況下應用更新。無論如何，應該是。 – Blunderfest 2014-12-02 19:49:34

嘗試做在$範圍的更新$應用塊這樣的：

$scope.apply(function() { 
    vm.something = some_new_value; 
});

爲了避免「文摘已在進行中」錯誤，換在$timeout

來源

2016-05-10 19:56:24

如何使用ControllerAs語法手動更新AngularJS視圖？

回答

相關問題