Question

在函数内部调用时不会触发简单的ng-class绑定，我该如何解决？

＆＃13;

@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers

＆＃13;

<link rel="stylesheet" asp-href-include="lib/bootstrap/dist/css/*.min.css" />

＆＃13;

Answer 1

在此示例中正常工作：

angular.module("app",[])

.controller("ctrl", function($scope) {

  $scope.afterHide = function() {
      $scope.inputState = "fade-in"; 
  };
  
  $scope.reset = function() {
      $scope.inputState = "";
  };
});

.fade-in {
    background-color: red;
}

<script src="//unpkg.com/angular/angular.js"></script>
<div ng-app="app" ng-controller="ctrl">

  <label ng-class="inputState">Next statement</label>

  <br><button ng-click="afterHide()">Invoke afterHide</button><br>
  <button ng-click="reset()">Reset</button>
</div>

如果它有效，那么我认为它与我的代码的整体逻辑有关。函数$scope.afterHide由其中一个指令上的事件触发，该指令在控制器外部定义。在html中它基本上只是另一个具有变化状态的div。当发生更改时，页面上的其他元素也会受到影响，在此上下文中，其他元素是label标签。当更改发生时，控制器中的$scope.afterHide函数由在控制器外部定义的指令调用。

范围按层次结构排列，模仿应用程序的DOM结构。

ng-click指令不能在其层次结构之外的作用域上调用函数。此外，如果ng-click指令位于使用隔离范围的指令内的模板上，则该事件必须通过表达式“&”，绑定连接到父作用域。

有关详细信息，请参阅

如何更改函数中范围的值 - 为什么我的代码不起作用？

1 个答案: