首页 > Angular1.x入门级自定义组件（导航条）

Angular1.x入门级自定义组件（导航条）

 



百度导航条






var app = angular.module('app', []);
app.directive('myComponent', function () {return {templateUrl: 'myComponent.html',controller: 'controllerName',};
});
app.run(["$templateCache", function ($templateCache) {$templateCache.put("myComponent.html", "
  • { {item}}
    • ");
}]);app.controller('controllerName', function ($scope, $attrs) {$scope.list = $attrs.menu.split("|");
});
    @charset "UTF-8";
/*这里设置组件的样式*/.baidu-nav {width: 100%;background: #f8f8f8;line-height: 36px;height: 38px;}li {cursor: pointer;list-style: none;float: left;width: 54px;height: 38px;display: inline-block;text-decoration: none;text-align: center;color: #666;font-size: 14px;
}li:hover, li.active {border-bottom: 2px solid #38f;font-weight: 700;color: #323232;
}

    更多相关：