我有一个包含数字的字符串列表的 JSON 文件，例如
{
"MyAccount": "105"
}
在前端，我可以对这个值执行条件吗？IE：
<div ng-if="MyAccount > 100">
//code ig account greater than 100
</div>
尝试在不必编写任何 JS 的情况下执行此操作，因为此 ng-if 将位于复杂的 ng-repeat 中
我试过了：
<div ng-if="parseInt(MyAccount) > 100">
//code ig account greater than 100
</div>
我用这个角度代码来比较两个日期是否相等.
码:
<div class="batchPlannings">
<div ng-repeat="batchPlanning in batchPlannings"
ng-animate="'animate'">
<div ng-switch="batchPlanning.status">
<div ng-switch-when="MAPPED" class="my-switch-animation">
<p>start date: {{batchPlanning.startDate}}</p>
<p>placement date: {{placementDate}}</p>
<div ng-if="batchPlanning.startDate === {{placementDate}}"
class="my-switch-animation">
<a th:href="@{/placement}" class="list-group-item"
sec:authorize="hasAnyRole('ROLE_SYSTEM_ADMIN', 'ROLE_CENTER_ADMIN')">Batch
with batch code '{{batchPlanning.batchCode}}' is ready for
placements</a>
</div>
</div>
</div>
</div>
</div>
在这里,我想检查测试这两个日期或相同或不同我得到那些日期完美和罚款,这些也是平等但无法使这个条件成真.我用==检查了它,但没有结果.
任何帮助或建议将不胜感激.
视图:
<html ng-app="myApp">
....
<body>
<div ng-controller="myCtrl">
<p>Current user {{loggedOnUser}}</p>
<div ng-if="user.name == {{loggedOnUser}}" ng-repeat="user in users">
<p>Should display</p>
</div>
</div>
</body>
</html>
控制器:
angular.module("myApp", [])
.controller("myCtrl", function($scope){
$scope.loggedOnUser = "xxx"; // for testing purpose
$scope.users = [
{
name : "xxx",
age: "25"
},
{
name : "yyy",
age: "26"
}
];
});
如何使用ng-if与angularJS表达式或有任何其他方法来实现这一点？如果我的loggedOnUser等于user.name,我想显示div
提前致谢
我是角度新手，所以这可能不是最好的方法。随着我了解更多，我可能会重做大部分已经做过的事情。
我正在使用 url 路由，ngRoute它工作得很好。在其中一个页面中，我有许多 ng-include 模板 - 再次，一切都很好。
在其中一个ng-include模板中，我使用两个directives来显示模板。
<provider-search providers="practiceData.providers" states="ref.states" specialties="ref.specialties" status="updateSearchStatus" ng-show="searchStatus == 1"/>
<search-list status="updateSearchStatus" addp="addProvider" providers="searchResults" ng-if="searchStatus == 2" />
每个指令都使用独立的作用域和控制器。问题是只有第一个指令有效。如果我切换顺序，则第二个指令（现在如果是第一个位置）将起作用。简而言之，只有首先列出的指令才有效。
任何帮助表示赞赏。
<h3 style="color:#00bfff;margin:-14px 0 16px 0px" class="inline" *ng-if="data.for == 'next'">
{{data.bannerText}}<sup><small>{{data.super}}</small></sup>
</h3>
<span class="NotinStockGrey"> {{data.textOne}} </span>
<span style="color:#00bfff"> {{data.textTWo}} </span>
错误:
zone.js:420未处理的Promise拒绝:模板解析错误:无法绑定到'ng-if',因为它不是'h3'的已知属性.("0Fb;保证金:-16px 0 16px 0px">
嗨,我无法理解ngIf.
目前我有json的对象
Profile:{
0:{name: 'Jen',
intro:'',
gender:'female',
age:'1992'},
1:{name: 'John',
intro:'Hi',
gender:'male',
age:'1988'}
}
第一个对象的介绍是空字符串,当它有空字符串时我想显示'用户尚未写入它'.
我试过像这样使用ngIf但当然这不起作用.我该怎么办？
<div *ngFor="let p of Profile">
<p class="fontstyle2">
{{p.intro}}
</p>
<p class="fontstyle2" *ngIf="p.intro=''">
The user hasn't written it yet
</p>
</div>
我真的很努力让这个工作,并花了很长时间看似简单的实现.
我有一个父(quote-results)组件,有两个子组件:
<quote-table></quote-table>
<call-back-pop-up *ngIf="showCallBackPopUp"></call-back-pop-up>
我在子'quote-table'组件中有一个带有click事件的按钮:
<button class="button-secondary" (click)="showCallbackToggle()">Request a callback</button>
并为此子项'quote-form'组件中的click事件和@Output()提供了一个函数:
@Output() showCallBackPopUp;
showCallbackToggle() {
this.showCallBackPopUp = true;
}
我在父(quote-results)组件中也有一个@Input():
@Input() showCallBack: boolean;
我希望在'quote-table'中触发的click事件上显示call-back-pop-up组件
我已经尝试使用布尔为此和发射器切换@Input和@Output,但没有运气.
我做错了什么,我怎么能让它发挥作用？
我有以下代码：
<li *ngFor="let item of serviceList; let i = index;">
<button *ngIf="currentTools contains i" (click)="processService(item)">
Run Service</button>
</li>
Angular 2中有什么方法可以检查数组是否包含我项目的索引？
我基本上只想显示索引号在数组中的项目（currentTools），该数组在不同的过程中被动态修改。
我正在开发一个具有多个用户类型的项目（超级用户 - 学校管理员 - 教师）
每个角色都有特权看到一些元素。
如何使用 *ngIf 根据登录的用户角色隐藏元素？
这是Stack-blitz 上的项目链接，我上传了其中的一些内容来指导我进行实时预览。
在app里面你会发现common services >> auth，这是有登录服务和认证保护的文件夹。
在models >> enum 里面，你会发现用户类型enum。
在组件登录中，您将找到定义用户类型的表单。
在路由内部，您将看到为每个组件制定的预期角色。
我为测试而创建的用户：
这应该将您路由到学校列表
管理员（具有超级用户角色）：test1@test.com 密码：12345
这应该将您路由到仪表板
学生（有学生角色）：test2@test.com 密码：12345
例如，我想隐藏仪表板上的元素，只显示给超级用户角色，我该怎么做？
我知道 ngIf 有一种方法，但我坚持在 NgIf 中编写它的正确方法，我想要我的代码示例而不是虚拟代码。
更新：问题已解决，因此我删除了用于测试的用户。
我有两个页面(diary.component和redactor.component)都绘制相同的组件food.component,只有很小的区别:如果是diary.component- 食物应该有一个"添加按钮".如果是redactor.component- 食物应该有一个删除按钮.我尝试在父组件中food.component.html使用boolean解决此问题,并使用*ngIf 检查此状态,但它不起作用.问题是什么,我该如何解决？这是我的代码,以便更好地理解:
diary.component.ts
isDiary: boolean;
ngOnInit() {
this.isDiary = true;
}
food.component.html
<div class="food">
<button *ngIf="isDiary; else isRedactor" (click)="sendFood(food.name, food.nutritional_value)" class="add-btn" type="button">
<i class="fas fa-plus"></i>
</button>
<ng-template #isRedactor>
<button><i class="fas fa-times"></i></button>
</ng-template>
...
</div>
谢谢 !
angular-ng-if ×10
angular ×6
angularjs ×4
angular5 ×1
arrays ×1
boolean ×1
components ×1
date ×1
directive ×1
javascript ×1
ng-hide ×1
ng-show ×1
ngfor ×1
typescript ×1
user-roles ×1