我试图创建一个自定义指令,在我的指令模板中,我包含了一个 angular-bootrstrap 库的指令。在这种情况下,弹出指令。 当我运行我的应用程序时,出现以下错误:
Error: [$compile:multidir] Multiple directives [bar, bar] asking for template on: navbar-default progress-bar" ng-class="type && 'progress-bar-' + type" role="navigation
>progressbar" aria-valuenow="{{value}}" aria-valuemin="0" aria-valuemax="{{max}}" ng-style="{width:>percent + '%'}" aria-valuetext="{{percent | number:0}}%" ng-transclude="" bar="">`
我的代码有什么问题?
应用程序.js
(function () {
'use strict';
//var angular = require('angular');
function config($routeProvider) {
$routeProvider
.when('/', {
templateUrl: 'views/init.html',
controller: 'MainCtrl',
controllerAs: 'main',
resolve: {
jobsData: function(ServiceMain) {
return ServiceMain.getData();
},
itemsData: function(ServiceMain,$resource) {
return ServiceMain.getItems();
},
}
});
}
angular.module('testApp', ['ngRoute','app.controller','ui.bootstrap'])
.config(config);
})();
主页.php
<!DOCTYPE html>
<html lang="en" ng-app="testApp">
<head>
<meta charset="UTF-8">
<title>Document</title>
<!-- inject:css -->
<link rel="stylesheet" href="css/style.css">
<!-- endinject -->
<!-- bower:css -->
<link rel="stylesheet" href="bower_components/animate.css/animate.css">
<link rel="stylesheet" href="bower_components/ng-sortable/dist/ng-sortable.min.css">
<link rel="stylesheet" href="bower_components/angular-hotkeys/build/hotkeys.min.css">
<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css">
<!-- endinject -->
</head>
<body>
HERE I USED MY CUSTOM DIRECTIVE
<nav bar class="navbar navbar-default" role="navigation"></nav>
<!-- Here we'll to load the templates of the App -->
<div ng-view></div>
<!-- bower:js -->
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-route/angular-route.js"></script>
<script src="bower_components/jquery/dist/jquery.js"></script>
<script src="bower_components/angular-bootstrap/ui-bootstrap-tpls.js"></script>
<script src="bower_components/bootstrap/dist/js/bootstrap.js"></script>
<!-- endinject -->
<!-- inject:js -->
<script src="components/app.js"></script>
<script src="components/controllerMain.js"></script>
<script src="components/directiveUserBar.js"></script>
<script src="components/serviceMain.js"></script>
<!-- endinject -->
<script type="text/javascript">
var base_url = '<?php echo base_url(); ?>';
</script>
</body>
</html>
指令用户栏.js
(function () {
'use strict';
function userBarDirective() {
return{
restrict: 'EA',
templateUrl:'views/user-bar.html',
link: function (scope, element, attrs) {
// DOM manipulation/events here!
scope.showMe = function(){
alert('showSomething!');
}
scope.logOut = function(){
alert('log out me!');
}
},
controller: function($scope){
$scope.modules = ['a','b','c','d'];
$scope.user = "Gonzalo"
}
};
}
angular
.module('testApp')
.directive('bar',userBarDirective);
})();
我的指令模板:user-bar.html
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#userMenu">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Info Plant</a>
</div>
<div class="collapse navbar-collapse" id="userMenu">
<ul class="nav navbar-nav" ng-repeat="module in modules">
<li><a ng-click="showMe()">{{module}}</a></li>
</ul>
<div class="form-group">
<a popover-placement="bottom" popover="user" popover-title="Gonzalo"> Log Out</a>
</div>
</div>
</div>
最佳答案
我的第一个想法是,您在同一个元素上使用了两个指令,并且都指定了一个 template 或 templateurl 属性。
就是说,查看您的代码,我们没有得到完整的图片,因为您的错误告诉您有关 progressbar 但您粘贴的任何代码中都没有使用该指令.
在未来,显示错误的工作 plunker 将更有帮助地确定错误所在。
关于php - 错误多个指令 [bar, bar] 在使用自定义指令和 angular-bootstrap 时询问模板,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25997554/
Rails2.3可以选择随时使用RouteSet#add_configuration_file添加更多路由。是否可以在Rails3项目中做同样的事情? 最佳答案 在config/application.rb中:config.paths.config.routes在Rails3.2(也可能是Rails3.1)中,使用:config.paths["config/routes"] 关于ruby-on-rails-Rails3中的多个路由文件,我们在StackOverflow上找到一个类似的问题
我有多个ActiveRecord子类Item的实例数组,我需要根据最早的事件循环打印。在这种情况下,我需要打印付款和维护日期,如下所示:ItemAmaintenancerequiredin5daysItemBpaymentrequiredin6daysItemApaymentrequiredin7daysItemBmaintenancerequiredin8days我目前有两个查询,用于查找maintenance和payment项目(非排他性查询),并输出如下内容:paymentrequiredin...maintenancerequiredin...有什么方法可以改善上述(丑陋的)代
大约一年前,我决定确保每个包含非唯一文本的Flash通知都将从模块中的方法中获取文本。我这样做的最初原因是为了避免一遍又一遍地输入相同的字符串。如果我想更改措辞,我可以在一个地方轻松完成,而且一遍又一遍地重复同一件事而出现拼写错误的可能性也会降低。我最终得到的是这样的:moduleMessagesdefformat_error_messages(errors)errors.map{|attribute,message|"Error:#{attribute.to_s.titleize}#{message}."}enddeferror_message_could_not_find(obje
我需要从一个View访问多个模型。以前,我的links_controller仅用于提供以不同方式排序的链接资源。现在我想包括一个部分(我假设)显示按分数排序的顶级用户(@users=User.all.sort_by(&:score))我知道我可以将此代码插入每个链接操作并从View访问它,但这似乎不是“ruby方式”,我将需要在不久的将来访问更多模型。这可能会变得很脏,是否有针对这种情况的任何技术?注意事项:我认为我的应用程序正朝着单一格式和动态页面内容的方向发展,本质上是一个典型的网络应用程序。我知道before_filter但考虑到我希望应用程序进入的方向,这似乎很麻烦。最终从任何
我有一个ModularSinatra应用程序,我正在尝试将Bootstrap添加到应用程序中。get'/bootstrap/application.css'doless:"bootstrap/bootstrap"end我在views/bootstrap中有所有less文件,包括bootstrap.less。我收到这个错误:Less::ParseErrorat/bootstrap/application.css'reset.less'wasn'tfound.Bootstrap.less的第一行是://CSSReset@import"reset.less";我尝试了所有不同的路径格式,但它
设置:狂欢ruby1.9.2高线(1.6.13)描述:我已经相当习惯在其他一些项目中使用highline,但已经有几个月没有使用它了。现在,在Ruby1.9.2上全新安装时,它似乎不允许在同一行回答提示。所以以前我会看到类似的东西:require"highline/import"ask"Whatisyourfavoritecolor?"并得到:Whatisyourfavoritecolor?|现在我看到类似的东西:Whatisyourfavoritecolor?|竖线(|)符号是我的终端光标。知道为什么会发生这种变化吗? 最佳答案
我想向我的Controller传递一个参数,它是一个简单的复选框,但我不知道如何在模型的form_for中引入它,这是我的观点:{:id=>'go_finance'}do|f|%>Transferirde:para:Entrada:"input",:placeholder=>"Quantofoiganho?"%>Saída:"output",:placeholder=>"Quantofoigasto?"%>Nota:我想做一个额外的复选框,但我该怎么做,模型中没有一个对象,而是一个要检查的对象,以便在Controller中创建一个ifelse,如果没有检查,请帮助我,非常感谢,谢谢
我有一个具有一些属性的模型:attr1、attr2和attr3。我需要在不执行回调和验证的情况下更新此属性。我找到了update_column方法,但我想同时更新三个属性。我需要这样的东西:update_columns({attr1:val1,attr2:val2,attr3:val3})代替update_column(attr1,val1)update_column(attr2,val2)update_column(attr3,val3) 最佳答案 您可以使用update_columns(attr1:val1,attr2:val2
我正在尝试修改当前依赖于定义为activeresource的gem:s.add_dependency"activeresource","~>3.0"为了让gem与Rails4一起工作,我需要扩展依赖关系以与activeresource的版本3或4一起工作。我不想简单地添加以下内容,因为它可能会在以后引起问题:s.add_dependency"activeresource",">=3.0"有没有办法指定可接受版本的列表?~>3.0还是~>4.0? 最佳答案 根据thedocumentation,如果你想要3到4之间的所有版本,你可以这
我遵循MichaelHartl的“RubyonRails教程:学习Web开发”,并创建了检查用户名和电子邮件长度有效性的测试(名称最多50个字符,电子邮件最多255个字符)。test/helpers/application_helper_test.rb的内容是:require'test_helper'classApplicationHelperTest在运行bundleexecraketest时,所有测试都通过了,但我看到以下消息在最后被标记为错误:ERROR["test_full_title_helper",ApplicationHelperTest,1.820016791]test