1

如标题所示，我试图在页面加载（而不是点击）的 div 上设置一个类，ng-class但我不知道如何或是否可能。它div被包装在一个模块和控制器中，我之前试图在其中设置变量，$scope.frontpage但它不起作用。

<div id="main" role="main" class="clearfix" data-ng-module="ValidationBoxModule" ng-controller="ValidationBoxClassController">
    <div validation-id="dataValidationSummary" validation-summary ng-class="frontpage" ></div>
    <asp:ContentPlaceHolder ID="MainContentPlaceHolder" runat="server"></asp:ContentPlaceHolder>
</div>

angular.module("ValidationBoxModule", []).controller("ValidationBoxClassController", ["$scope", function ($scope) {

    $scope.frontpage = "";

    ($("#main").find(".sliderBox")) ? $scope.frontpage = "frontpage" : $scope.frontpage = "";
}]);

那么有没有办法做到这一点？

4

1 回答 1

3

你想要做的不是angular way。如：“不要在控制器中进行 DOM 操作”。而是使用指令，例如：

function Ctrl($scope) {
  $scope.frontpage = false;
}

angular.module('app', ['app.directives']);

angular.module('app.directives', []).directive('isFrontpage', function () {
  return {
    restrict: 'A',
    link: function (scope, element) {
      scope.frontpage = angular.element(element).find('#main .sliderBox').length > 0;
    }
  };
});

和：

<body ng-controller="Ctrl" is-frontpage>
  <div id="main">
    <div class="sliderBox"></div>
  </div>

  <div
    validation-id="dataValidationSummary"
    validation-summary
    ng-class="{frontpage: frontpage}">
  </div>
</body>

演示：http: //jsbin.com/unihon/4/

于 2013-02-13T17:16:47.460 回答