我是AngularJS 1.2使用ng-animate的新手.我不确定为什么我的ng-animate不能使用某个类名,但是我在一个例子中看到的默认为简单淡入淡出.
在这个例子中,我尝试将我的ng-animate类设置为'animation':http: //plnkr.co/edit/QWQUUVdcLmzLKRvVibqN？p = preview
但是当我使用默认值时,我的动画类名称只是".ng-enter"和".ng-leave",动画中的淡入淡出似乎工作正常.
http://plnkr.co/edit/lEQhMwd6RWmsdmJbosu0?p=preview
任何帮助将不胜感激,谢谢!
我有一个ng-repeat循环$http.get()结果的元素.
<tr ng-repeat="blog in posts">
<td style="text-align:center">{{ $index+1 }}</td>
<td>{{ blog.title }}</td>
<td>
{{ blog.author.name }}
</td>
<td>
{{ blog.created_at | date:'MMM-dd-yyyy' }}
</td>
</tr>
我created_at作为timestamp在MySQL数据库中的表.而我正在使用angular.js v1.0.7.
我从db表获取相同的输出并且日期过滤器不起作用.我怎么解决这个问题？
我的ajax电话,
$http({method: 'GET', url: 'http://localhost/app/blogs'}).
success(function(data, status, headers, config) {
$scope.posts = data.posts;
}).
error(function(data, status, headers, config) {
$scope.posts = [];
});
当动态创建"inputName"时,有人会如何使用formName.inputName.$有效？
<form name="formName">
<input ng-repeat="(variable) in variables"
type="text" name="variable.name"
ng-model="variable.name" required />
</form>
HTML输入属性"name"的输出将是字符串"variablename",它将应用于所有重复输入.
如果我们试过这个
<form name="formName">
<input ng-repeat="(variable) in variables"
type="text" name="{{ variable.name }}"
ng-model="variable.name" required />
</form>
HTML输入属性"name"的输出将是字符串"{{variable.name}}",它将应用于所有重复输入.
在这两个条件中的任何一个中,都不会动态创建每个重复输入元素的name属性; 所有输入将共享相同的输入名称.如果您想根据特定名称调用特定输入,那就太好了.
javascript angularjs angularjs-directive angularjs-scope angularjs-ng-repeat
当使用ngAnimate淡入ngRepeat中的每个项目时,当前所有项目同时淡入.在前一项褪色至例如50%之后,每个项目是否可能淡入,从而产生级联效应？
<ul>
<li ng-repeat="phone in phones" ng-animate="{enter: 'phone-fade-enter'}">
<img src="{{phone.img}}"> {{phone.name}}
</li>
</ul>
使用ngAnimate,如果可以延迟每个项目的动画,那将是很好的,例如:
<li ng-repeat="phone in phones" ng-animate="{enter: 'phone-enter', delay: 500}">
有办法解决这个问题吗？
谢谢!
我正在努力思考如何使用ng-include不使用额外的DOM元素,因为我正在从简单的HTML演示中构建一个角度应用程序.我正在使用非常纤薄的HTML与完全开发的,严格的DOM耦合的CSS(由SASS构建)和重构是我想不惜一切代价避免的.
这是实际的代码:
<div id="wrapper">
<header
ng-controller="HeaderController"
data-ng-class="headerType"
data-ng-include="'/templates/base/header.html'">
</header>
<section
ng-controller="SubheaderController"
data-ng-class="subheaderClass"
ng-repeat="subheader in subheaders"
data-ng-include="'/templates/base/subheader.html'">
</section>
<div
class="main"
data-ng-class="mainClass"
data-ng-view>
</div>
</div>
我需要<section>作为重复元素,但有自己的逻辑和不同的内容.内容和重复次数都取决于业务逻辑.如您所见,将ng-controller和ng-repeat放在<section>元素上将不起作用.但是,插入一个新的DOM节点会是什么,这正是我想要避免的.
我错过了什么？这是最佳做法还是有更好的方法？
编辑:只是为了澄清评论中的问题,我试图生成的最终HTML将是:
<div id="wrapper">
<header>...</header>
<section class="submenuX">
some content from controller A and template B (e.g. <ul>...</ul>)
</section>
<section class="submenuY">
different content from same controller A and template B (e.g. <div>...</div>)
</section>
<section class="submenuZ">
... (number of repetitions is defined in controller A e.g. through some service)
</section>
<div>...</div>
</div>
我想使用相同的模板B(subheader.html)的原因是为了代码清洁.我设想subheader.html有一些ng-switch来返回动态内容. …
我使用角度js改变了以下内容
<section id="social">
<h2 class="line">Social Profiles</h2>
<a href="#" class="first"><i class="icon-facebook"></i></a>
<a href="#"><i class="icon-twitter"></i></a>
<a href="#"><i class="icon-linkedin"></i></a>
<a href="#"><i class="icon-google-plus"></i></a>
<a href="#" class="last"><i class="icon-rss"></i></a>
<div class="clear"></div>
</section>
对此
<section id="social">
<h2 class="line">Social Profiles</h2>
<a ng-repeat="sMedia in socialMedia" ng-if="$first" href="#" >
<i class="{{sMedia.icon}}"></i>
</a>
<div class="clear"></div>
</section>
一切似乎都很好,除了我找不到添加class="first"第一个元素和class="last"最后一个元素的方法ng-repeat.
我正在使用离子和AngularJS(AngularJS材料)构建混合应用程序.此应用程序还具有使用Node.js和socket.io构建的集成聊天.
我现在遇到的问题是,只有200条消息,应用程序加载所有消息的速度非常慢(在浏览器中为200ms - 在应用程序中为> 4秒,即使使用CrossWalk,也有使用track.id进行跟踪)并且还要在textarea中输入插入消息的速度变慢了.
我有两个解决方案来解决这个问题:
1)我认为虚拟重复将是最好的解决方案(我已经在另一个页面上实现了它并且它像魅力一样滚动1500个项目)但问题是消息可以根据它们的长度和md-virtual-具有不同的高度 - 重复要求是所有元素必须具有相同的高度才能工作.
2)所以也许我们可以转向无限滚动方法,但现在的问题是使用ion-infinite-scroll指令做这件事有点棘手,因为聊天需要在到达顶部而不是底部时触发loadMore() .
所以我的问题是:有没有人有一个解决方法,在聊天中使用平滑/快速ng-repeat或者可以处理不同高度的虚拟重复指令或在顶部工作的无限滚动？
javascript angularjs angularjs-ng-repeat angular-material ionic
我对角度有点新,而且我的json和ng-repeats也有问题.我有一个"模块"列表,然后列出"周":
{
"modules":
{
"module1":
{
"title":"name of module1",
"description":"description of module1",
"weeks":{"week1":{"title":"Week 01"}
},
"module2":
{
"title":"name of module2",
"description":"description of module2",
"weeks":{"week2":{"title":"Week 02"},"week3":{"title":"Week 03"}
}
}
}
我的最终输出是一个表,我可以让模块重复,但是我很难理解我做错了几个星期循环.这是我的模板:
<table class="table table-bordered" ng-repeat="module in ocw.modules">
<tr>
<td>
<h3 class="moduletitle">{{ module.title }}</h3>
<h4>Description</h4>
<p>{{ module.description }}</p>
</td>
</tr>
<tr ng-repeat="week in ocw.modules.weeks">
<td>
{{ week.title }}
</td>
</tr>
</table>
所以这将输出2个表,具有正确的标题和描述,但我似乎无法正确显示几周.请注意,一些"模块"有一个"周".我不确定错误是在我的模板还是json中.
谢谢你的帮助.小号
我正在尝试使用ng-repeat生成表单输入.注意:'customFields'是一个字段名称数组:["Age","Weight","Ethnicity"].
<div class="control-group" ng-repeat="field in customFields">
<label class="control-label">{{field}}</label>
<div class="controls">
<input type="text" ng-model="person.customfields.{{field}}" />
</div>
</div>
设置'ng-model'的最佳/正确方法是什么？我想将它作为person.customfields.'fieldname'发送到服务器,其中fieldname来自"customFields中的字段".
我从服务请求返回了以下json数据:
{
"entries": [{
"id": 2081,
"name": "BM",
"niceName": "bodmas"
}]
}, {
"id": 8029,
"name": "Mas",
"niceName": "Masm"
}]
}],
"count": 2
}
我在html中尝试以下代码来循环遍历这些数据:
<option ng-repeat="entry in entries" value="{{entry.name}}">{{entry.name}}</option>
运行代码时出现以下错误:
Error: [ngRepeat:dupes] Duplicates in a repeater are not allowed. Use 'track by' expression to specify unique keys. Repeater: entry in entries, Duplicate key: string:c
以下是我的控制器的代码:
myApp.controller("MyController", ['$scope', '$http', '$log', function($scope, $http, $log){
...
$http.get('https://myServiceURL').success(function(data){
$scope.entries = data;
});
}]);
有人可以帮我理解为什么我会收到这个错误？