我有一个数组,其中的项目我不知道键或值.看起来像这样:
{"key1":true,"key2":true, "key3":'value'}
如果我使用ng-repeat循环:ng-repeat="(k, v) in array"我不允许在转发器中获得重复项.
如何在角度模板中循环这种数组,我不知道键,值或它的长度？
我想在AngularJS中使用一个指令,该指令应该允许0到1之间的十进制数.此外,它也可以允许"-1".
例如:-1有效0有效1有效0.12有效0.99有效1.01无效
如果您有任何建议,请告诉我.谢谢.
angularjs angular-ui angularjs-directive angularjs-scope angularjs-ng-repeat
我在div元素中有两个表.我想在模板加载时隐藏两个表.并希望根据条件显示它们.为此,我在div中创建了两个表,并在两个表中放置了ng-show属性.但是表格是可见的而不是隐藏的 我的代码是
如果我在div中放置相同的ng-show属性它会被隐藏,但是表格不会被隐藏.告诉我这里我做错了什么？帮助将是可观的
<table ng-modal="deferredquiz" ng-show="showdeferredquizz" ng-true-value="true" ng-false-value="false" class="ng-hide">
<tr>dddddddddddddddddddddd</tr>
<tr data-ng-repeat="question in quizdata.questions">
<td ng-switch="question.question_type">
</td>
</tr>
<tr>
</tr>
</table>
<table ng-show="showimmediatequiz" ng-true-value="yes" ng-false-value="no">
<tr>
</tr>
<tr>
<td><button ng-click="submitDeferredQuiz()">Submit</button></td>
</tr>
</table>
javascript angularjs angularjs-directive angularjs-scope angularjs-ng-repeat
我想在我的视图中解析这个控制器:
testapp.controller("searchController", function($scope, $rootScope, $http, $location) {
var load = function() {
console.log('call load()...');
var url = 'products.json';
if($rootScope && $rootScope.appUrl) {
url = $rootScope.appUrl + '/' + url;
}
$http.get(url)
.success(function(data, status, headers, config) {
$scope.product = data;
angular.copy($scope.product, $scope.copy);
});
}
load();
});
但是我已经实现了这样的解析:
<div class="container main-frame" ng-app="testapp"
ng-controller="searchController" ng-init="init()">
<h1 class="page-header">Products</h1>
<table class="table">
<thead>
<tr>
<th width="25px">ID</th>
<th>TITLE</th>
<th>PRICE</th>
<th>Description</th>
<th width="50px"></th>
</tr>
</thead>
<tbody>
<tr ng-repeat="p in product">
<td>{{p.id}}</td>
<td>{{p.title}}</td>
<td>{{p.price}}</td>
<td>{{p.description}}</td>
<!-- ng-show="user.id &&user.id==e.user_id" --> …我正在尝试上传并在ng-repeat中显示图像.
我已成功使用jquery函数上传和显示没有ng-repeat的图像:
<html>
<head>
<script src="jquery.js" type="text/javascript"></script>
</head>
<body>
<input type='file' />
<img id="myImg" ng-src="#" alt="your image" style="width:50px;height:50px"/>
</body>
</html>
...
<script>
$(function () {
$(":file").change(function () {
if (this.files && this.files[0]) {
var reader = new FileReader();
reader.onload = imageIsLoaded;
reader.readAsDataURL(this.files[0]);
}
});
});
function imageIsLoaded(e) {
$('#myImg').attr('src', e.target.result);
};
</script>
如果我将代码更改为ng-repeat内部,则jQuery函数可以正常工作:
<div ng-repeat="step in stepsModel">
<input type='file' />
<img id="myImg" ng-src="#" alt="your image" style="width:50px;height:50px"/>
/div>
2个问题:
非常感谢
我正在学习Angular,我正在尝试建立一些东西来学习.我试图在下面尽可能清楚地解释自己 - 任何帮助将不胜感激.
示例:http : //jsbin.com/micasafetise/2/ http://jsbin.com/micasafetise/2/edit?html,js,console,output
我创造了自己的这些数据
$scope.people =
[
{
"personID": 1,
"first_name": "Sam",
"last_name": "Stimpson",
"attending": false
},
{
"personID": 2,
"first_name": "Alison",
"last_name": "van Schoor",
"attending": true
},
{
"personID": 3,
"first_name": "Lindsay",
"last_name": "van Schoor",
"attending": false
}
];
我在我的视图中创建了一个输出,如下所示:
<div ng-repeat="person in people">
<a href="" ng-click="isAttending()">
{{person.first_name}}{{person.last_name}} - {{person.attending}}
</a>
</div>
现在我被困住了.我希望能够点击一个人并将他们的参加字段从false更新为true.我知道我可以像这样使用ng-click
$scope.isAttending = function() {
alert("is attending");
};
但是没有线索如何更新我点击的人在$ scope.people中将false更改为true.
当我实现这一目标时,我计划再使用过滤器进行另一次ng-repeat来显示那些参加但我能够做到这一点的人.
任何人都可以帮助我或给我一些建议,任何事情都会在此刻受到赞赏.
提前致谢.
我写了一个我想在这里做的例子:http : //jsbin.com/micasafetise/2/ http://jsbin.com/micasafetise/2/edit?html,js,console,output
angularjs angularjs-scope angularjs-ng-repeat angularjs-filter
我正在使用Firebase/AngularFire构建一个Ionic App.我面临着一个棘手的问题:我希望我的ng-repeat能够更好地进行性能优化.我听说最好的方法就是无限滚动.我使用AngularFire在服务/工厂中获取所有数据 - 更具体地说,$ firebaseArray.
我谷歌发现了这个:http://firebase.github.io/firebase-util/#/toolbox/Paginate/example/ionic
问题1:使用Firebase util库的无限滚动是无限滚动服务器端无限滚动还是客户端？这个库是否解决了ng-repeat的性能问题,如下所述:(http://www.alexkras.com/11-tips-to-improve-angularjs-performance/)
问题2:我的firebaseArray实际上需要命令动态计算一个名为distance的变量.我是否仍可以在安全规则中使用.indexOn规则来提高查询性能？(声音不可能,因为距离最初没有存放在火场中)
这是我的代码:我的工厂:taskService.js
var ref = new Firebase(FirebaseUrl);
var tasks = $firebaseArray(ref.child('tasks'));
var Task = {
all: tasks,
getAllTasks: function() {
if (tasks.length == 0) {
tasks = $firebaseArray(ref.child('tasks'));
} else {
tasks = tasks;
}
return tasks;
},
}
我的ng-repeat视图控制器:
$scope.tasks = taskService.getAllTasks();
$scope.tasks.$loaded().then(function(data){
calculateDistance($scope.tasks, $scope.userCurrentLocation);
});
var unwatch = $scope.tasks.$watch(function(event) {
calculateDistance($scope.tasks, $scope.userCurrentLocation);
});
$scope.$on('$ionicView.leave', function(){
// Anything you can think of
unwatch();
});
}
//--------------GeoLocation …我在使用选项卡内部的链接时遇到了问题,这些链接会更改视图并替换选项卡.仅在选项卡中使用ng-repeat但在静态选项卡中不使用时才会出现此问题.
那是主页:
<div ui-view name="pageContent">
<uib-tabset>
<uib-tab ng-repeat="tab in tabs" heading="{{tab.name}}" active="tab.active" ng-click="!tab.disable && load(tab.link,tab.id)">
</uib-tab>
<!-- <uib-tab heading="Static title">Static content</uib-tab>
<uib-tab heading="Static title">Static content 2</uib-tab> <!-- when I use the comment code it works. -->
</uib-tabset>
<div>
<a class="btn btn-link" ui-sref="xxxx.yyyyy" role="button">
{{$storage.aaaa.bbbbb}}
</a><!-- this view replace the pageContent -->
</div>
</div>
错误是:
错误:[$ compile:ctreq]无法找到指令'uibTab'所需的控制器'uibTabset'!
提前致谢
uiview angularjs angularjs-ng-repeat angular-ui-router angular-ui-tabset
我正在使用angularjs,下面是我的代码,我需要输出为
红色
绿色
黄色
它显示为一个数组
['red','green','yellow']
请帮忙.
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js">
</script>
<body ng-app="myApp" ng-controller="myCtrl">
<div ng-repeat="product in products | filter: { color: true }">
{{product.type}}
</div>
</body>
var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
$scope.products = [
{ id: 1, name: 'test', color: true, type:['red','green','yellow'] },
{ id: 2, name: 'bob', color: false },
{ id: 3, name: 'john', color: false },
{ id: 4, name: 'rock', color: false },
{ id: 5, name: 'mercy', color: false },
{ id: …下面的代码片段需要打印toolDTO对象(即对象数组,每个对象都有键和值对).
<div ng-show="isResult" style="color: green;">
<table class="tble">
<thead>
<tr ng-repeat="(key, value) in toolDTO[0]" align="center"
style="background: #7e7e7e; color: #FFFFFF; font-size: small;">
<th><b>{{key}}</b></th>
</tr>
</thead>
<tbody ng-repeat="tool in toolDTO">
<tr ng-repeat="(key, value) in tool"
style="font-size: small;">
<td>{{value}}</td>
</tr>
</tbody>
</table>
</div>
toolDTO结构:
[
{
"EMPLOYEE_NUMBER": "1234",
"FIRST_NAME": "Ram",
"LAST_NAME": "Rakul",
"EMAIL": "Ram.Rakul@example.com",
"UPDATED_BY": 5678,
"UPDATED_DATE": "2018-01-23 17:25:42.635"
},
{
"EMPLOYEE_NUMBER": "45678",
"FIRST_NAME": "vinod",
"LAST_NAME": "nai",
"EMAIL": "vinto.nani@example.com",
"UPDATED_BY": 5678,
"UPDATED_DATE": "2018-01-12 20:38:50.191"
},
]
ng重复代码打印上述数据,如下所示.
EMAIL
EMPLOYEE_NUMBER
FIRST_NAME
LAST_NAME
UPDATED_DATE
UPDATED_BY
Ram.Rakul@example.com …angularjs ×9
javascript ×3
angular-ui ×1
firebase ×1
html ×1
jquery ×1
jsp ×1
tabular ×1
uiview ×1
view ×1