使用angularjs将其他页面的css类应用于标题

时间:2016-05-06 13:31:39

标签: angularjs angular-material

我有一个带切换按钮的文本输入。我想从style:word-wrap: break-word;title应用/删除CSS page 2。我该怎么办?

第1页:

  <h2>Title</h2>

  <input ng-model="card.title">

  <md-button ng-model="card.title" ng-click="toggleWrap()">
     <md-icon>{{(wrapText===true) ? 'wrap_text' : 'remove'}}</md-icon>
  </md-button>

JS 1:

  $scope.wrapText = true;
  $scope.toggleWrap = function() {
     $scope.wrapText = !$scope.wrapText;
  };

第2页:

<h2 ng-class="{'word-wrap': yesORno}">{{title}}</h2>

2 个答案:

答案 0 :(得分:1)

如果$ scope.wrapText是您的切换值,那么

<h2 ng-class="{'word-wrap': wrapText}">{{title}}</h2>

如果第1页和第2页有不同的控制器,则可以将wrapText保存为全局变量,例如$ rootScope,或使用服务与控制器之间的通信。

答案 1 :(得分:1)

非常简单。只需将$rootScope中的变量绑定到这样,它就可以在所有的controller / html中访问:

$rootScope.wrapText = true;
$scope.toggleWrap = function() {
  $rootScope.wrapText = $rootScope.wrapText ? false : true;
};

然后你可以在你的html中设置:

<h2 ng-class="{'word-wrap': wrapText}">{{title}}</h2>