我试图使用dirPagination但它不起作用.请参阅我的代码:http://plnkr.co/edit/18BxNhHRNyRoI17sBGQF？p = preview
我的代码:
<!DOCTYPE html>
<html ng-app="myApp">
<head>
<link data-require="bootstrap-css@3.1.1" data-semver="3.1.1" rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" />
<script data-require="angular.js@1.3.0-beta.5" data-semver="1.3.0-beta.5" src="https://code.angularjs.org/1.3.0-beta.5/angular.js"></script>
<script data-require="jquery@*" data-semver="2.0.3" src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
<script data-require="bootstrap@3.1.1" data-semver="3.1.1" src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<script>
var myApp = angular.module('myApp', [])
.controller('PsCtrl', ['$scope', function ($scope) {
$scope.data = [
{a:1, b:1},
{a:2, b:2},
{a:3, b:3}
];
}]);
</script>
<script src="dirPagination.js"></script>
</head>
<body>
<div ng-controller="PsCtrl">
ItemCount: {{data.length}}
<ul>
<li dir-paginate="item in data | itemsPerPage: 2">{{ item }}</li>
</ul>
<dir-pagination-controls></dir-pagination-controls>
</div>
</body>
</html>
我只把它作为输出:
ItemCount: …我有一个简单的ng-repeat,显示一个值列表(财务收入).如何计算此列表中的平均值？
<div ng-repeat="data in MyData">
{{ data.income }}
</div>
<div>
Average:
</div>
哪个显示:
11
14
8
9
21
10
2
1
5
13
谢谢
angularjs angularjs-directive angularjs-scope angularjs-ng-repeat
我目前正在制作出生日期的一天下拉列表,此字段中的值将取决于选择的月份.我目前有这个工作如下所示,但我想将逻辑移动到控制器或过滤器,而不是将其留在html文件中.
<select name="personal_dob_day" ng-model="dob_day">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
<option>11</option>
<option>12</option>
<option>13</option>
<option>14</option>
<option>15</option>
<option>16</option>
<option>17</option>
<option>18</option>
<option>19</option>
<option>20</option>
<option>21</option>
<option>22</option>
<option>23</option>
<option>24</option>
<option>25</option>
<option>26</option>
<option>27</option>
<option>28</option>
<option ng-if=" dob_month != 'February' || !( dob_year % 4)")>
29
</option>
<option ng-if=" dob_month != 'February'">
30
</option>
<option ng-if=" dob_month == 'January' || dob_month == 'March' || dob_month == 'May' || dob_month == 'July' || dob_month == 'August' || dob_month == 'October' || dob_month == 'December'"> …angularjs angularjs-directive angularjs-scope angularjs-filter
我一直在网上寻找答案,但我似乎无法找到任何明确的答案.
问题似乎是ngAnimate指令没有添加类ng-enter或ng-leave路由更改时.我创建了一个测试应用程序并将该ngAnimate指令包含在应用程序中.我还创建了animate类并将该类应用于ng-view元素
我的测试应用程序的链接在这里:http://plnkr.co/edit/6qCMeIkWeXeTQyDWcu29？p = preview
我正在关注创建指令的博客文章:http://joelhooks.com/blog/2014/02/11/lets-make-full-ass-angularjs-directives/
他似乎建议将控制器与指令分开.但是尝试在链接函数中从外部控制器运行函数导致undefined不是一个函数.
调节器
wrmcControllers.controller 'voteCtrl', ($scope,$attrs) ->
this.hasVoted = false
this.init = ->
if this.hasVoted
#scope.vote = Vote.get(scope.vote)
else
this.vote = null
this.voteUp = ->
if this.vote == true
this.vote = null
else
this.vote = true
this.hasVoted = true
this.voteDown = ->
if this.vote == false
this.vote = null
else
this.vote = false
this.hasVoted = true
指示
wrmcDirectives.directive 'voteSet', ->
restrict: 'AE'
scope: {}
controller: 'voteCtrl'
templateUrl: 'vote.html'
link: (scope,element,attrs,controller) ->
console.log controller
controller.init()
Console.log控制器输出
function () …对不起,如果我在这里丢失了一些愚蠢的东西,但我真的尝试了各种组合来使这个代码工作,但没有运气.
我在学习directive中AngularjS,从Recipes with AngularJS而停留在这个码-
https://github.com/fdietz/recipes-with-angular-js-examples/tree/master/chapter3/recipe4
我相信它应该在Hello World文本之前打印Heading.但它不会来.让我知道我的代码中缺少的内容 - p
代码整体 -
<!doctype html>
<html lang="en" ng-app="myApp">
<head>
<meta charset="utf-8" />
<title>Directive Example</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.10/angular.min.js"></script>
<script>
var myApp = angular.module("myApp", []);
myApp.directive("myWidget", function(){
return {
restrict: "E",
transclude: true,
template: "<div ng-transclude><h3>Heading</h3></div>"
};
});
</script>
</head>
<body>
<my-widget>
<p>Hello World!!</p>
</my-widget>
</body>
</html>
我有一个angularjs指令,它监听我的textarea的粘贴事件:
element.on('paste', function (event) {
});
我如何获得粘贴的文字？我试过了:
event.clipboardData.getData('text/plain')
......和:
event.originalEvent.clipboardData
......但两者都没有用.任何的意见都将会有帮助.
如何调用$ watctGroup表单链接函数的指令.我有两个简单的范围元素(整数),我想成对观看它们.我认为$ watchGroup比使用$ watch('[element1,element2'],...)之类的东西更有效.
我正在使用带有Ionic的angular-google-places-autocomplete(https://github.com/kuhnza/angular-google-places-autocomplete)但在使用此指令时捕获所选选项时遇到问题.
我有这样的指令设置:
<!-- template -->
<input type="text" placeholder="Place search" g-places-autocomplete ng-model="locationSearchResult"/>
<h5>Result</h5>
<pre ng-bind="locationSearchResult | json"></pre>
我的控制器代码设置为监视locationSearchResult模型的更改,如果它确实更改以将新位置保存到本地存储:
// Controller
$scope.locationSearchResult = {};
$scope.$watch('locationSearchResult', function(newVal, oldVal) {
if (angular.equals(newVal, oldVal)) { return; }
$scope.$storage.loc = newVal;
$state.go('new-page');
});
当使用自动完成时,它似乎按预期工作 - 我得到一个预测列表,从预测列表中选择预测会使用所选位置的名称更新文本输入,并且所选位置的JSON数据显示在结果标题.但是,这个变化似乎并没有被$ scope.$ watch在控制器中看到.
因此,我似乎无法捕获搜索结果数据并对其执行任何操作 - 例如将其添加到用户会话中.
也许我只是以错误的方式去做(虽然我使用相同的方法与ngAutocomplete,它工作正常).
autocomplete google-places-api angularjs-directive ionic-framework
我想动态地向表中添加一行.我想在几个表中重用该行.
我尝试使用指令和使用,ng-include但两个选项都没有像我预期的那样工作.
基本上,这就是我做的:
myapp.directive('myRow', function () {
return {
restrict : 'E',
replace : true,
scope : { mytitle : '@mytitle'},
template : '<tr><td class="mystyle">{{mytitle}}</td></tr>'
}
});
并在HTML中:
<table>
<tbody>
<tr><td>data</td></tr>
<my-row></my-row>
</tbody>
</table>
该<tr>元素获得绘制但最终之外的<table>在DOM元素.
有没有一种简单的方法来使用angularjs包含表行？