angular-ng-if

Angular *ngIf variable with async pipe multiple conditions

由 别说谁变了你拦得住时间么 提交于 2020-02-21 10:07:53
问题 There's quite good doc of using *ngIf in Angular: https://angular.io/api/common/NgIf But, is that possible to have *ngIf async variable and multiple checks on that? Something like: <div *ngIf="users$ | async as users && users.length > 1"> ... </div> Of course, it's possible to use nested *ngIf, like: <div *ngIf="users$ | async as users"> <ng-container *ngIf="users.length > 1"> ... </ng-container> </div> but it'd be really nice to use only one container, not two. 回答1: Simply do it like this

How to use filter in ng-if and variable?

由 无人久伴 提交于 2020-01-22 08:23:09
问题 In this example, I use filter in the ng-repeat, but how do I use it in a variable and ng-if , something like: {{languages.length | filter: {available: true}}} and ng-if="languages.length == 0 | filter: {available: true}" See Fiddle. HTML <div ng-controller="mainController"> <div>There are {{languages.length}} languages in total.</div> <div>??? There are {{languages.length}} languages available.</div> <div ng-if="languages.length == 0">??? Sorry, there are no languages available.</div> <ol>

Why is my ng-if not working? It's not hiding the div

由 試著忘記壹切 提交于 2020-01-11 13:22:07
问题 In my Angular app, I want a certain div to appear if a variable is true, and to disappear if it is false. However, it is not working. See my Fiddle Can anyone help me understand why? HTML <div ng-controller="MyCtrl"> <div id="newProjectButton" class="project" ng-click="newProjectActive()" ng-if="!creatingNew"> <h1> + </h1> <h3> New Project </h3> </div> <div id="newProjectActive" class="project" ng-if="creatingNew"> <form> <input name="name" ng-model="newProjectName" type="text"></input>

Why is my ng-if not working? It's not hiding the div

由 两盒软妹~` 提交于 2020-01-11 13:22:06
问题 In my Angular app, I want a certain div to appear if a variable is true, and to disappear if it is false. However, it is not working. See my Fiddle Can anyone help me understand why? HTML <div ng-controller="MyCtrl"> <div id="newProjectButton" class="project" ng-click="newProjectActive()" ng-if="!creatingNew"> <h1> + </h1> <h3> New Project </h3> </div> <div id="newProjectActive" class="project" ng-if="creatingNew"> <form> <input name="name" ng-model="newProjectName" type="text"></input>

get access to $scope in ng-if

由 不羁岁月 提交于 2020-01-07 02:22:25
问题 What is the better approach to get access to scope created by ng-if in my directive (without $parent.params.text): <span ng-if="params" uib-tooltip="{{params.text}}"></span> .directive('myDirective', functions(){ return { templateUrl: 'template.html', replace: true, $scope: { data: '=' }, controller: function(){ if (data) { //some logic $scope.params.text = 'text' } } } }) 回答1: I've noticed that I don't have to use $parent if my variable is nested inside an object. For example: controller

Unable to use ng-if with ng-repeat

由 放肆的年华 提交于 2020-01-05 11:01:50
问题 I was tried to use ng-if inside ng-repeat but it seems ng-if is not working properly. I referred couple of forum links in StackOverflow but it doesn't help me. I'm using angular version 1.3.0 HTML <!DOCTYPE html> <html ng-app="myModule"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="description" content=""> <meta name="author"

Angular ng-if inside option element and ng-repeat not working

由 荒凉一梦 提交于 2020-01-01 04:39:06
问题 I have select element which should list available currencies. Default currency should have prefix "Default" before its name. For some reason, that prefix is showing for all currencies in the list. Test HTML: <div ng-app="testApp"> <div ng-controller="MainCtrl"> <select> <option ng-repeat="rate in rates track by $index"> <span ng-if="rate.is_default">Default</span> <span>{{rate.name}}</span> </option> </select> </div> </div> TEST JS: var app = angular.module("testApp", []); app.controller(

ng-click not working with ng-if

由 旧时模样 提交于 2019-12-31 22:39:46
问题 Why does the second button not work, when ng-if is used? I want to realize a button that is present only when the model value is set / not ""/ not null. Template: <input type="text" ng-model="blub"/> <br/> <button ng-click="blub = 'xxxx'">X</button> <br/> <button ng-click="blub = 'yyyy'" ng-if="blub.length">Y</button> Controller: angular.module('test', []) .controller('Main', function ($scope) { // nothing to do here }); To play around: JSFiddle 回答1: Use ng-show Instead of ng-if . That should

Passing AngularJS ng-form object into ng-if?

由 情到浓时终转凉″ 提交于 2019-12-24 13:29:37
问题 When I click "preview" here the save button in my preview mode is not disabled http://plnkr.co/edit/I3n29LHP2Yotiw8vkW0i I think this is because the form object (testAddForm) is not available in the scope of the ng-if. I know that I should use an object in my controller because it's passed down all the way, but the form object is created by angular and not available in the ng-if. How can I work around that? <!DOCTYPE html> <html ng-app="app"> <head> <script data-require="angular.js@1.2.27"

Create a reusable template which can be used on various pages

由 拥有回忆 提交于 2019-12-24 00:09:07
问题 In my angular 5 application, I need to do this on every HTML page <span *ngIf="item.createTime; else notAvailable">  {{item.createdTime | date:'medium'}} </span> and on the end of page create that template <ng-template #notAvailable> <span class="text-muted f-12" [innerText]="'N/A'"></span> </ng-template> there is repeating the same line of code on every HTML page, so looking for any solution which helps me to create one common component/directive which has only #notAvailable content and can
订阅 angular-ng-if