我有一个表格,其中每行的最后一列包含一个小的加载图标,我想在单击表格内的按钮时显示该图标.
当使用ng-repeat生成每个表行时,加载器将显示在每一行而不是单独的一行中.如何仅针对当前单击的索引将ng-show设置为true或false?
模板:
<tr ng-repeat="record in records">
<td>{{ record.name }}</td>
<td><a ng-click="someAction(record.name)">Some Action</a></td>
<td ng-show="loading">Loading...</td>
</tr>
Run Code Online (Sandbox Code Playgroud)
控制器:
$scope.someAction = function(recordName) {
$scope.loading = true;
};
Run Code Online (Sandbox Code Playgroud) 使用RxJs我试图重现一个演示.但我没有得到任何结果.而是将错误视为:distinct.flatMapLatest is not a function
我在这做错了什么?我需要在library这里添加吗?
这是我的尝试:但是看一下demo来获得真正的问题是什么面孔.
$(document).ready(function(){
var $input = $('#input'),
$results = $('#results');
var keyups = Rx.Observable.fromEvent($input, 'keyup')
.map(e => e.target.value)
.filter(text => text.length > 2);
var throttled = keyups.throttle(500);
var distinct = throttled.distinctUntilChanged();
function searchWikipedia (term) {
return $.ajax({
url: 'http://en.wikipedia.org/w/api.php',
dataType: 'jsonp',
data: {
action: 'opensearch',
format: 'json',
search: term
}
}).promise();
}
var suggestions = distinct.flatMapLatest(searchWikipedia);
suggestions.subscribe(data => {
var res = data[1];
/* Do something with the data like …Run Code Online (Sandbox Code Playgroud) 我有一个动态数据集来呈现Angular.换句话说,我无法访问在运行时返回的列名.
我可以将列名称作为标题和数据本身显示没有问题.ng-repeat(或者它可能是JS本身)虽然拒绝按照创建的顺序返回列.您可以在小提琴中看到列被排序,因此它们显示为"年龄名称重量",我需要它们的方式,"名称年龄重量"
我创建了另一个列名称数组及其正确的顺序($ scope.order),但我似乎找不到使用Angular对数据进行排序的方法.
请给我一个按原始顺序显示此数据的方法.
我创建了一个JSFiddle:http://jsfiddle.net/GE7SW/
这是一个设置数据的简单范围:
function MainCtrl($scope) {
$scope.output = [
{
"name": "Tom",
"age": "25",
"weight" : 250
},
{
"name": "Allan",
"age": "28",
"weight" : 175
},
{
"name": "Sally",
"age": "35",
"weight" : 150
}
];
$scope.order = {
"name": 1,
"age": 2,
"weight" : 3
};
}
Run Code Online (Sandbox Code Playgroud)
这是HTML:
<table ng-app ng-controller="MainCtrl">
<thead>
<tr>
<th ng-repeat="(key,value) in output.0">{{key}}</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="row in output">
<td ng-repeat="(key,value) in row">{{value}}</td>
</tr>
</tbody>
</table> …Run Code Online (Sandbox Code Playgroud) 我这里有一个泡菜.我必须通过webservice调用获取我的多级导航菜单.
由于我的导航菜单中可以包含无限量的子菜单,因此我不得不使用递归指令来构建我的父/子导航结构.现在我想弄清楚如何将它变成一个功能性的dropmenu结构.我正在看看angularui-bootstrap,他们有一个Dropdown Toggle,它有一些基本的dropmenu功能,但由于我使用了递归指令,我的菜单结构已经有了angularjs生成的css类附加到它们.angularjs-bootstrap dropmenu有css类,它们与我的angularjs生成的类不同....看哪!
<ul>
<li ng-repeat="parent in parents" class="ng-scope">
<recursive-list-item on-node-click="onNodeClickFn(node)" parent="parent" class="ng-isolate-scope ng-scope">
<a data-ng-click="onNodeClick({node: parent})" href="javascript:void(0)" class="ng-scope ng-binding">Clothes</a>
<!-- ngIf: parent.children.length > 0 -->
<ul data-ng-if="parent.children.length > 0" class="ng-scope">
<!-- ngRepeat: child in parent.children -->
<li ng-repeat="child in parent.children" class="ng-scope">
<recursive-list-item data-on-node-click="onNodeClickFn(node)" data-parent="child" class="ng-isolate-scope ng-scope">
<a data-ng-click="onNodeClick({node: parent})" href="javascript:void(0)" class="ng-scope ng-binding">Gortex Jackets</a>
<!-- ngIf: parent.children.length > 0 -->
</recursive-list-item>
</li>
<!-- end ngRepeat: child in parent.children -->
...
...
...
</ul>
</recursive-list-item>
</li>
<!-- end ngRepeat: child …Run Code Online (Sandbox Code Playgroud) javascript angularjs angularjs-directive angularjs-bootstrap
这是angular-resource variable / object表示表单数据的范围:
$scope.form = {
name: 'bob',
email: 'bob@bobs.com'
}
Run Code Online (Sandbox Code Playgroud)
我可以通过各种方式观察name变量的变化.
$scope.$watch('form.name', function(newVal) {
if(newVal) {
alert(newVal)
}
});
Run Code Online (Sandbox Code Playgroud)
如果更改了任何文件,可以使用什么方法 - 名称,电子邮件或任何scope.form可能有的?
我的目的是根据用户在表单上更改某些内容的事实禁用或启用我的表单"保存".
我有一个抽象profile状态,它有多个子状态(对于配置文件页面的不同选项卡),然后我希望另一个子状态的配置文件是一个模态.我已经实现了这样的事情:
$stateProvider
.state('profile', {
url: '/profile/:profileID',
templateUrl: 'profile.html',
controller: 'ProfileCtrl',
abstract:true,
resolve: {
user: ...
}
})
.state('profile.circles', {
url: '',
templateUrl: 'profilecircles.html',
controller: 'profilecirclesCtrl',
resolve: { circle: ... }
})
.state('profile.squares', {
url: '/collections',
templateUrl: 'profilesquares.html',
controller: 'profilesquaresCtrl',
resolve: { squares: ... }
})
.state('profile.editprofile', {
url: '/edit',
onEnter: ['$window','$modal', function($window, $modal) {
$modal.open({
templateUrl: 'editprofile.html',
controller: 'editProfileCtrl',
resolve: {
user: ...
}
}).result.then(function() {
$window.history.back();
},function() {
$window.history.back();
});
}]
})
Run Code Online (Sandbox Code Playgroud)
这很有效,除了因为editprofile是正方形和圆形的兄弟,当该状态处于活动状态并且模态处于视图中时,正方形或圆形状态被卸载,并在模态关闭时再次加载.
当profile.editprofile状态处于活动状态时,有没有办法让这些状态保持活动状态?我喜欢的东西state..editprofile.
我正在尝试使我的表单输入透明,并将其放在我的div之上.基本上我希望文本字段对其背后的任何内容都是透明的.有什么建议?
<head>
<style type="text/css">
.WRAPPER {
background-color: #000;
height: 575px;
width: 975px;
background-image: url(exit-gate/exit-gate-bg.png);
top: auto;
margin: -8px;
}
body {
background-color: #000;
}
</style>
<style type="text/css">
term {
background: transparent;
border: none;
}
</style>
</head>
<body>
<div id="WRAPPER">
<div class="term"><input name="email" type="text" id="email">
<form name="form1" method="post" action="insert_ac.php">
<input type="image" src="exit-gate/white-box-10.png" alt="{alternate text}" name="submit" value="submit">
</form>
</div>
</div>
</body>
</html>
</div>
Run Code Online (Sandbox Code Playgroud) 我想,而不只是告诉他们"你的字段太短"告诉用户,"你的字段必须至少{{ value }}字符长".你能用ng-messages做到这一点吗?
我现在正在编写一些脚本,但在尝试否定函数内的布尔值时遇到了问题。我的意思是:
var test = true;
function changeThisBoolPlease(asd){
asd=!asd;
}
alert(test);
changeThisBoolPlease(test);
alert(test);
Run Code Online (Sandbox Code Playgroud)
警报为真,然后为真。
有任何想法吗?JS 引用不是很完美吗?
编辑:
好的,这只是我功能的一部分:
function przesun(kolor, figury, castlings, x1, y1, x2, y2, strona) {
kolor = nowaPozycjaKolor(kolor,x1, y1, x2, y2);
figury = nowaPozycjaFigur(figury,x1, y1, x2, y2);
strona = !strona;
}
Run Code Online (Sandbox Code Playgroud)
实际上我不能返回这个值。如何?
我正在尝试制作一个页面,其中一些div水平对齐,我希望宽度根据内容调整大小,所以如果内容大于屏幕大小,我将获得水平滚动.我有这个:
<div>
<div style="width: 300px; height: 300px; background-color: black; margin-left: 10px; float: left;"></div>
<div style="width: 300px; height: 300px; background-color: black; margin-left: 10px; float: left;"></div>
<div style="width: 300px; height: 300px; background-color: black; margin-left: 10px; float: left;"></div>
<div style="width: 300px; height: 300px; background-color: black; margin-left: 10px; float: left;"></div>
<div style="width: 300px; height: 300px; background-color: black; margin-left: 10px; float: left;"></div>
</div>
Run Code Online (Sandbox Code Playgroud)
子div正在并排排列,但是当达到屏幕大小时,它会分成一个新行.有任何想法吗 ?