angular的uiRouter服务学习(5) --- $state.includes()方法

$state.includes 方法用于判断当前激活状态是否是指定的状态或者是指定状态的子状态.

$state.includes(stateOrName,params,options)

$state.includes方法接受三个参数,其中第二和第三个都不知道是干啥的...估计也不太用得到,就暂时不管了...

stateOrName:字符串(必填). 是一个状态的名字.

比如当前的激活状态是 "contacts.details.item" 

如下调用:

$state.includes("contacts");                              //返回true
$state.includes("contacts.details");                      //返回true
$state.includes("contacts.details.item");                 //返回true
$state.includes("detail");                                //返回undefined
$state.includes("item");                                  //返回undefined

也可以使用glob语法:

复制代码
$state.$current.name = 'contacts.details.item.url';
 
$state.includes("*.details.*.*"); // returns true
$state.includes("*.details.**"); // returns true
$state.includes("**.item.**"); // returns true
$state.includes("*.details.item.url"); // returns true
$state.includes("*.details.*.url"); // returns true
$state.includes("*.details.*"); // returns undefined
$state.includes("item.**"); // returns undefined
复制代码

可以用于激活某个tab,让当前项高亮显示:

<li ng-class="{active:state.includes('dashboard.report')}"><a ui-sref="dashboard.report">Reports</a></li>

需要注意的是,在表达式里直接用$state是不行的,需要在控制器中把$state赋值给$scope下的变量.这样在表达式里才能使用:

复制代码
    $stateProvider.state('dashboard',{
        url:'/dashboard',
        templateUrl:'./tpls/dashboard.html',
        controller:function($scope,$state){
            $scope.state = $state;              
        }
    })
复制代码

 

posted @ 2017-07-18 17:31  铭绘  阅读(274)  评论(0编辑  收藏  举报