使用指令创建nav-tabs?

时间:2014-08-06 21:16:22

标签: angularjs

我的视图中有导航标签

<ul class="nav nav-tabs" ng-controller="myController">   
           <li ng-class="{ active: isActive('/Page1')}"><a href="#/Page2">myPage1</a></li>          
           <li ng-class="{ active: isActive('/Page2')}"><a href="#/Page2">myPage2</a> </li> 
        </ul>

如何将其写入指令?问题是大括号..

1 个答案:

答案 0 :(得分:0)

对不起,我现在首先对应的问题。我找到了解决问题的方法。

我的指示:

myApp.directive('userNavbar', function(){

return {
    restrict : 'AE',
    templateUrl : '../js/partials/userNavbarTemplates.html',
    controller : function($scope, $element, $location) {
        $scope.isActive = function(viewLocation) {

            var active = false;

            if (viewLocation === $location.path()) {
                active = true;
            }
            return active;
        };
    }
};

});

我的userNavbarTemplates:

    <title>userNavbar</title>
<div class="row">
    <div class="span6">
        <ul class="nav nav-tabs">
            <li ng-class="{ active: isActive('/page1')}">
                <a href="#/Page1">nav. to page1</a>
            </li>
            <li ng-class="{ active: isActive('/page2')}">
                <a href="#/Page2">nav. to page2</a>
            </li>
        </ul>
</div>

在我的视图中可以添加

<div data-user-Navbar></div>