ng-click不管用。有人可以帮助我，如何使用$compile？
我创建了一个 plunker http://plnkr.co/edit/AhxGYnOsJ7rPqcQquMfq?p=preview
// main.js
var app = angular.module('myApp', ['ngGrid']);
app.controller('MyCtrl', function($scope) {
})
.directive('myDir', function($compile){
return {
restrict: 'CAE',
link: function(scope, element, attrs){
var dropdown = '';
dropdown += '<ul class="dropdown-menu pull-right" role="menu" aria-labelledby="'+ attrs.id +'">';
dropdown += '<li role="presentation"><a href="javascript:void(0);" ng-click="alert(\'a\')">Actions</a></li>';
dropdown += '</ul>';
//dropdown = $compile(dropdown)(scope);
element.after(dropdown);
}
}
});
我试图了解如何使用多个ng-repeat-end's。
我有一个表格，显示了 20 年的数据，分为 5 年的块。
表中的每一行都显示了 5 年的数据。这就是我展示前 1-5 年的方式。
<table>
<tbody>
<tr ng-repeat="history in HistoryCategory.Category[key]">
<th>{{ history.CompanyName }} 1-5 years</th>
<td ng-repeat="mycredits in history.Histories.slice(0, 5)" ng-switch="mycredits.Status">
<span ng-switch-when="0">Some text</span>
<span ng-switch-when="1">Some text</span>
<span ng-switch-when="2">Some text</span>
<span ng-switch-when="3">Some text</span>
<span ng-switch-when="4">Some text</span>
<span ng-switch-when="null">null</span>
<span ng-switch-default>Error</span>
</td>
</tr>
</tbody>
</table>
<div ng-repeat-end class="scroll-btns">
<div class="scroll-btns">
<div class="scroll-left icon-left" ng-click="scrollLeft()"></div>
<div class="scroll-right icon-right" ng-click="scrollRight()"></div>
</div>
</div>
在表格的底部是一个DIVwith class scroll-btns.. 所有这些都是允许上面的表格可以滚动并显示一些向左/向右移动的图标。
我现在想要做的是展示第 6-10、11-15 和 16-20 年（在同一张表中）。我试过了： …
angularjs angularjs-directive angularjs-scope angularjs-ng-repeat
我有这样的 HTML
<form ng-controller="testCtrl1">
<div ng-include="'test/views/navigationbar.html'"></div>
<div ng-include="'test/views/processnav.html'"></div>
<div ng-include="'test/views/leftprocesstabs.html'"></div>
</div>
</form>
我想编写通用方法来检查我所有的 ng-include 文件是否已加载。
加载所有文件后，我需要进行服务器调用。
有没有办法在angular js中检查这个？
我正在开发一个Angular的自定义指令,允许用户设置标题.但是,似乎没有按预期工作.
app.directive('appTitle', function () {
var myTitle = {};
myTitle.restrict = 'E';
myTitle.scope = {
//title: '='
title: 'title='
};
myTitle.transclude = true;
myTitle.template = "<div class='jumbotron'><h1 class='text-center'>
{{text}}</h1><div class='text-center' data-ng-transclude></div></div>";
return myTitle;
});
它在HTML中使用如此(描述效果很好,但标题不是):
<app-title title="This is a title">This is a description.</app-title>
提前致谢.
我有这段代码可以正常工作，并将从控制器接收到的数据显示到绑定中。但是，我试图将服务器数据设置为string.empty，并且希望此默认文本“ Your name”会出现，但事实并非如此。如果服务器返回空字符串，我希望显示默认文本。
<label for="name" class="label-proj" ng-bind="ctrl.name">Your name</label>
我正在使用一个应用程序,我在service.js服务结束时有以下行.
$rootScope.$broadcast('rootScope:Object')
这里Object是API服务的输出.如果我现在想在我的实际app.js文件中使用此Object,我该如何使用它？上面的行指定了什么以及如何在以后的页面中使用它？
任何帮助表示赞赏.
编辑:
从给定的答案尝试以下:
在服务页面中:
this.getobject=function(){
//http api Function call with result as response.data = resp
$rootScope.$broadcast('rootScope:resp',resp);
}
在子范围页面中:
resp=[];
$rootScope.$on('rootScope:resp',function(resp) {
$scope.resp=resp;
console.log(resp);
});
$scope.$on('rootScope:resp', function(e, params){
console.log(params); // respobject
});
不幸的是,两者都没有在控制台上打印.这个方法有什么问题吗？
javascript angularjs angularjs-directive angularjs-rootscope
给定一个数组时,我有一个指令,它使用Name作为复选框的标签为该项目列表创建复选框.
HTML
<div>
<a style="float:right; margin-bottom: 5px;" ng-click="selectNone()" href="#">Select None</a>
<a style="float:right; margin-bottom: 5px;margin-left: 10px" ng-click="selectAll()" href="#">Select All</a>
<div class="cleared"></div>
<div class="form-input form-list">
<label ng-repeat="item in valuelist | orderBy:'Name'">
<input type="checkbox" checklist-model="model" checklist-value="item" /> {{item.Name}}<br />
</label>
</div>
JS
'use strict';
growllApp.directive('checkboxlist', [function () {
return {
restrict: 'E',
templateUrl: 'scripts/modules/checkboxlist.template.html',
controller: 'checkboxlistController',
scope: {
model: "=",
value: "=",
valuelist: "="
}
}
}]);
growllApp.controller('checkboxlistController', ['$scope', '$routeParams', '$location', '$cookieStore', function ($scope, $routeParams, $location, $cookieStore) {
$scope.selectAll = function () { …我正在玩基本的Angular JS.我以为我很了解自定义指令但是如果我将它们用作元素属性,我只能让它们出现在模板中.而且我不想使用评论或类名,因为那些不是最佳实践.基于文档和其他来源,这些指令应该作为元素和元素属性.
在我index看来,我会看到我两次声明我的指令 - 在顶部块作为属性(工作)和底部块作为元素(不起作用).我有几个小时深入研究这个问题.非常感谢任何见解.
的index.html
<head>
<title>Test App</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href='styles/css/style.css' rel='stylesheet' type="text/css">
<script src="vendor/angular_1.2.13/angular.min.js"></script>
</head>
<body ng-app="testApp" class="app__body">
<div class="body__inner">
<header>
<h1>My New Test App</h1>
</header>
<div first-directive></div>
<div second-directive></div>
<first-directive></first-directive>
<second-directive></second-directive>
</div>
<script src="scripts/all-in-one.js" type="text/javascript"></script>
</body>
所有功能于one.js
'use strict';
angular.module('testApp', [])
.directive('firstDirective', function() {
return {
template: 'Hello World'
}
})
.directive('secondDirective', function() {
return {
templateUrl: '/scripts/directives/secondDirective.js'
}
})
.controller('firstCtrl', function($scope) {
$scope.message = "Hola Amigos!"
})
secondDirective.js
<div>
<h2>Esta Aqui!</h2> …基本上,我希望能够将ng-model从父指令传递给子指令.我可以只使用双向绑定值,但是后来我无法在子元素的父指令中使用ng-change.我也可以使用ng-click,但这不适用于非单击更改(例如文本区域而不是复选框).所以我想知道是否有一种方法允许自定义指令具有类似于输入,按钮,文本区域和其他html元素的ng-model/ng-change对.我想避免使用emits,ons,watch,传递回调等.我只是希望能够在自定义指令而不是输入上执行[input type ="checkbox"ng-model ="ngModel"].
父模板
<child ng-model="x" ng-change="x()"></toggle>
家长指令
$scope.x = function() {console.log('hi')};
儿童模板
<div>
<input type="checkbox" ng-model="ngModel">
</div>
儿童指令？
$scope.ngModel = $element.controller('ngModel');
我的角度版本是1.4.8 btw.
谢谢 :)
angularjs angularjs-directive angularjs-ng-change angularjs-ng-model angularjs-components
我有一个包含子对象的数组.孩子们也可以包含孩子.等等.
[
{
name: '1',
children: [
{
name: '1.1',
},
{
name: '1.2',
children: [
{
name: '1.2.1'
}
]
}
]
},
{
name: '2'
}
]
我写了这个,它适用于2个级别,但我希望它适用于n级:
<li *ngFor="let item of items">
{{item.name}}
<ul>
<li *ngFor="let child of item.children">
{{child.name}}
</li>
</ul>
</li>
我可以使用typescript生成所有内容,但有没有办法用模板指令执行此操作？