ng-show

AngularJS - hide/show div if date is within last 6 months

十年热恋 提交于 2020-12-08 02:20:52
问题 I have an ng-repeat that displays a list of dates, and information about purchases on that dates. HTML: <div ng-repeat="data in MyData"> <p> {{ data.purchasedOn.substring(6, data.purchasedOn.length - 2) | date:'dd/MM/yyyy' }} </p> <br> <p> {{ data.purchaseDescription }} </p> </div> Which displays: 01/02/2013 "Lorem ipsum dolor sit amet, consectetur adipisicing elit" 10/04/2014 "Lorem ipsum dolor sit amet, consectetur adipisicing elit" 02/08/2014 "Lorem ipsum dolor sit amet, consectetur

Angular指令

大憨熊 提交于 2020-03-05 16:50:45
一、指令 基础指令 1、ng-disabled 使用ng-disabled可以把disabled属性绑定到以下表单输入字段上: <input> ( text、 checkbox、 radio、 number、 url , email 、 submit); <textarea> ; <select> ; <button> 。 案例1: <input type="text" ng-disabled="true" placeholder="TypetoEnable"> 在下面的例子,文本字段会被禁用五秒,直到在$timeout中将isDisabled属性设置为true: <textarea ng-disabled="isDisabled">Wait5seconds</textarea> angular.module('myApp', []) .run(function($rootScope, $timeout) { $rootScope.isDisabled = true; $timeout(function() { $rootScope.isDisabled = false; }, 5000); }); 2、ng-select 用来将数据同HTML的<select> 元素进行绑定。这个指令可以和ng-model 以及ng-options指令一同使用,构建精细且表现优良的动态表单。 3

angular常用内置指令

非 Y 不嫁゛ 提交于 2020-03-05 16:49:32
angular常用指令 指令名称 描述 ng-app 用来定义模块的作用范围 ng-controller 用来定义控制器的作用范围 ng-repeat 循环遍历数组 ng-bind 绑定数据 同{{}} ng-show 用来显示或隐藏元素 值为true / false ,原理是设置元素的display ng-hide 用来显示或隐藏元素 值为true / false 用法和ng-show相反,原理设置元素的display ng-if 用来显示或隐藏元素 和ng-show/ng-hide的不同点是它直接删除元素 ng-cloak 用来解决“闪烁”的问题,原理是在angular还未执行的时候先让元素display:none ng-class 用来控制类名,使用方式:ng-class="{class:true/false}" class对应的值只要转为布尔值为true就是显示 ng-include 用来引用外部的模板文件 ng-disabled 用来控制表单是否禁用,值为true/false ng-src 用来引用图片的路径 可以解决"闪烁"问题 ng-href 用来引用a链接的路径 可以解决"闪烁"问题 ng-readyonly 用来控制表单是否只读,值为true/false ng-checked 用来控制复选框选中,值为true/false ng-selsected

AngularJS: ng-show / ng-hide not working with `{{ }}` interpolation

大憨熊 提交于 2020-02-08 16:09:09
问题 I am trying to show / hide some HTML using the ng-show and ng-hide functions provided by AngularJS. According to the documentation, the respective usage for these functions are as follows: ngHide – {expression} - If the expression truthy then the element is shown or hidden respectively. ngShow – {expression} - If the expression is truthy then the element is shown or hidden respectively. This works for the following usecase: <p ng-hide="true">I'm hidden</p> <p ng-show="true">I'm shown</p>

Select input shown with ng-show

跟風遠走 提交于 2020-01-16 19:14:46
问题 I'd like to put the focus on an input after it's shown with ng-show. However, this requires a jquery call to be made after the $digest cycle. Does anyone know how to run code after the item is shown, without resorting to setTimeout(), or some such thing? Here's an example plunk of the issue: http://plnkr.co/edit/synSIP?p=preview 回答1: You can write a simple directive , dont need jquery : yourApp.directive('focusme',function(){ return function(scope,elem,att){ elem.focus(); } }); and You can

ng-show被隐藏的“功能”

被刻印的时光 ゝ 提交于 2020-01-14 08:15:23
在工作中由于手残,少写了一个“=”,导致了一个惊人的事情,接口返回的内容被我莫名其妙的改了,所以页面显示也很有问题。 代码说明: // 接口返回的字段是status:'abc_ing' // HTML的内容 <p ng-show = "status='abc_ed'">我是谁?</p> <p ng-show = "status=='abc_ing'">我在哪?</p> 那么此时页面就会显示,我是谁? 原来,ng-show 后面的判断条件对status的值进行了赋值操作(居然还可以赋值),我是第一次遇到这种情况。 而且你把接口内容console出来当中的status也是abc_ed; 因为console出来的内容是当下最新的内容,也就是ng-show中的判断条件对其赋值之后的结果。 所以从这里得到一个教训,只要console出来的内容和接口返回的不一致,那么一定是对数据进行了操作。如果在js代码中找不到进行数据修改的任何蛛丝马迹,别忘记去HTML部分检查一下,或许就会找到答案。 来源: CSDN 作者: cool-girl 链接: https://blog.csdn.net/adoreen/article/details/103854314

AngularJS笔记3-- ng-show ng-class

旧城冷巷雨未停 提交于 2020-01-07 12:57:27
【推荐】2019 Java 开发者跳槽指南.pdf(吐血整理) >>> ng-show / ng-hide 通过绑定一个布尔型的变量,显示或隐藏HTML元素。 当 note.assignee为 true ( 也可以是非空字符串·,非0数字,非空JS对象等)时,assignee所对应的span元素可见。 ng-class 用于选择性的从HTML中添加或者删除CSS class . ng-class指令可接收字符串或对象作为参数 1.参数为字符串:直接把它作为CSS class名称应用到UI中 2 .参数是对象 ,angularJS会检查该对象的每一个属性及它所对应的值, 根据值是false 还是true来决定到底添加还是删除CSS class 本例:参数为对象,包含两个属性:当 note.done为true时,会添加名为 done的 css class 并删除 pending . 反之当note.done为false 时添加pending 删除done <!DOCTYPE html> <html ng-app="notesApp"> <head> <meta charset="UTF-8"> <title></title> <script src="js/angular.min.js"></script> <script src="js/jquery-3.1.1.min.js"><

Angular - Filter to remove blank strings from array

假如想象 提交于 2019-12-30 11:54:09
问题 I have an object of arrays... The array can contain blanks, how can i create an ANgular filter to remove the blanks to determine the length of the array? $scope.myData = { ["1", "1", "4", "4", "N", "4", "6", "8", "", "", "", "", "", "", "", "", "", "", ], ["2", "2", "4", "6", "0", "6", "5", "4", "2", "", "8", "", "", "", "", "", "", "", ], ["2", "3", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", ], ["3", "F", "D", "3", "5", "1", "D", "5", "", "", "", "", "", "", "", "", "",

ng-Show records of table on condition

无人久伴 提交于 2019-12-25 09:48:07
问题 I am trying to show rows and their sum of value of columns. It has three states on which condition held. 1) auto 2) live 3) autolive (not present in json, need auto and live combine in rows) Conclusion: On siteData.jobType==toggleValue if (toggleValue==auto ), it shows records of "auto" On siteData.jobType==toggleValue (toggleValue==live ), it shows records of "live" But on siteData.jobType==toggleValue (toggleValue==autolive ), it shows no record , coz autolive is not present in json How can

$index, in Table, not sequential… angularjs

时光怂恿深爱的人放手 提交于 2019-12-24 08:18:06
问题 I have a table in HTML. The rows are counted (via use of $index ), and only certain rows are shown (via use of ng-show ). Problem : $index does not return the right count. The table's count should go like "1,2,3...", but it does not. <tbody> <tr ng-repeat="fruit in basket" ng-show="fruit.isJuicy == type"> <td>{{$index + 1}}</td> <td>{{fruit.Name}}</td> </tr> </tbody> Here's the JSFiddle ; don't forget to click on the buttons to see the issue: http://jsfiddle.net/f6HCX/2/ What is causing this