AngularJS，如何在ng-if change上觸發與dom相關的javascript

Question

我有一個ng-if開頭的表單字段（輸入文本）。 在某些時候，ng-if值變為true。

發生這種情況時，我想執行一些可操作DOM的JavaScript。 為簡單起見，假設我需要選擇輸入值並關注該字段。

<input type="text" ng-value="foo" ng-if="show" onshow="doSomething()"/>
<button ng-click="toggle()"></button>

JavaScript

ctrl.foo = "bar";
ctrl.show = false;

ctrl.toggle = function(){
    ctrl.show = !ctrl.show;
}

我知道它看起來像“非角度方法”，但是在這里我認為動作與模型無關。

Answer 1

由於ng-if指令會在每次show變為true時執行模板，因此您可以使用ng-init 。 參見以下代碼片段並替換alert('test); 通過您想要的任何東西。

 angular.module('test', []).controller('test', function($scope, $element) { $scope.show = false; $scope.toggle = function() { $scope.show = !$scope.show; }; $scope.init = function() { alert($element.find('input').val()); }; }); 

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="test"> <div ng-controller="test"> <input type="text" value="foo" ng-if="show" ng-init="init()" /> <button ng-click="toggle()">Toggle</button> </div> </div>