Question

我有一个函数，当我发出某种单词时返回true。此功能正确并经过验证，但我无法将结果显示在视图上：

<li ng-class="{'active': ctrl.currentPage('parceiro')}"><a class="waves-effect waves-orange" href="parceiro.php"><i class="flaticon-college"></i>Seu Perfil</a></li>

对于ctrl.currentPage('parceiro')，结果为true（使用console.log测试）。有什么想法吗？

编辑：DOM显示为<li ng-class="{'active': ctrl.currentPage('parceiro')}"><a class="waves-effect waves-orange" href="parceiro.php"><i class="flaticon-college"></i>Seu Perfil</a></li>，{'active': ctrl.currentPage('parceiro')}不是＆＃34;已编译＆＃34; ？

此外，我测试的功能是

currentPage = function(name){
        return true;
    }

Answer 1

问题是我忘了在控制器内设置this到ctrl。

Answer 2

它看起来像你got it all sorted out，但想提供一些代码示例上下文以供将来参考。

下面的代码段是一个使用代码作为基础的工作示例。

＆＃13;

function SimpleCtrl(){}
SimpleCtrl.prototype = {
  currentPage:'',
  setCurrentPage:function(val){
    console.log({name:'currentPage', val:val, result:this.currentPage === val});
    return this.currentPage === val;
  }
};

angular.module('so-app', [])
  .controller('simpleCtrl', SimpleCtrl);

＆＃13;

.active {
  border:5px solid red;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.min.js"></script>
<div ng-app="so-app" ng-controller="simpleCtrl as ctrl">
  <br />
  <button type="button" ng-click="ctrl.currentPage = 'parceiro'">Set Page = 'parceiro'</button>
  <button type="button" ng-click="ctrl.currentPage = ''">Clear</button>
  <br />
  <h3>{{ctrl.currentPage}}</h3>
  <br />
  <br />
  <li ng-class="{'active': ctrl.setCurrentPage('parceiro')}"><a class="waves-effect waves-orange" href="parceiro.php"><i class="flaticon-college"></i>Seu Perfil</a></li>
</div>

＆＃13;

Answer 3

您的代码是完美的但是ng-class语句是错误的。所以使用正确的方式

`<li ng-class="({active: ctrl.currentPage('parceiro')})"><a class="waves-effect waves-orange" href="parceiro.php"><i class="flaticon-college"></i>Seu Perfil</a></li>`

尝试根据功能结果设置ng-class

3 个答案: