所以第一天开始使用 angularjs，我不太明白。我正在尝试使用 Angular Directive(指令)模仿 html5 占位符。在我向该字段添加 ng-model 之前，它完全有效，然后它仅在用户与该字段交互并破坏该字段的任何值后才有效。
代码在这里 http://jsbin.com/esujax/32/edit
App.directive('placehold', function(){
return {
restrict: 'A',
link: function(scope, element, attrs) {
var insert = function() {
element.val(attrs.placehold);
};
element.bind('blur', function(){
if(element.val() === '')
insert();
});
element.bind('focus', function(){
if(element.val() === attrs.placehold)
element.val('');
});
if(element.val() === '')
insert();
}
}
});
<textarea ng-model="comment" placehold="with a model it doesn't work"></textarea>
看起来 super 简单，但我迷路了
最佳答案
只需对您的示例进行少量修改:
app.directive('placehold', function() {
return {
restrict: 'A',
require: 'ngModel',
link: function(scope, element, attr, ctrl) {
var value;
var placehold = function () {
element.val(attr.placehold)
};
var unplacehold = function () {
element.val('');
};
scope.$watch(attr.ngModel, function (val) {
value = val || '';
});
element.bind('focus', function () {
if(value == '') unplacehold();
});
element.bind('blur', function () {
if (element.val() == '') placehold();
});
ctrl.$formatters.unshift(function (val) {
if (!val) {
placehold();
value = '';
return attr.placehold;
}
return val;
});
}
};
});
您可以在这里进行测试:http://plnkr.co/edit/8m54JO?p=preview
不确定，这是最好的解决方案，但它确实有效。即使您键入与占位符属性中相同的文本，它也会检查模型的焦点值。
关于javascript - Angularjs input[placeholder] 指令与 ng-model 中断，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/14777841/
我试图在原型(prototype)对象上定义一个不可枚举的toJSON函数，但运气不佳。我希望得到类似于ECMAScript5toJSON的东西:Object.defineProperty(obj,prop,{enumerable:false});然而，这将它定义为一个不能作为方法访问的属性。[编辑:尼克错了；它可以作为一种方法来访问。他的错误在于此问题中未显示的代码-有关详细信息，请参阅他对下面答案的评论。]我希望能够以不可枚举的方式定义函数，因为我计划在所有基本类型的原型(prototype)中定义(String，Number、Boolean、Array和Object)，以便我可以
我正在使用BufferGeometry来绘制构成地形的数千个立方体，但是如果我需要更改其中一个立方体的位置，我很难找到如何更新几何体。例如，我有这段代码来初始化我的几何图形:(我正在对thisexample的更新版本进行测试)//12trianglespercube(6quads)vartriangles=12*150000;vargeometry=newTHREE.BufferGeometry();geometry.attributes={position:{itemSize:3,array:newFloat32Array(triangles*3*3),numItems:triang
我正在为我正在进行的一个漂亮的新项目创建多边形。每当您将鼠标悬停在infoWindow上时，就会出现问题，多边形上的mouseout事件会触发。除非鼠标移出多边形和信息窗口，否则我不希望触发mouseout事件。有任何想法吗？这是大部分相关代码。infoWindow=newgoogle.maps.InfoWindow({content:myContent});varpolygon=newgoogle.maps.Polygon({paths:polygonPath,strokeColor:data.color,strokeOpacity:0.5,strokeWeight:0,fillCo
以下代码适用于Firefox浏览器。但是，不是Chrome。下面的代码有什么问题？window.onload=function(){document.body.onscroll=Test.callFn;}varTest=newfunction(){this.callFn=function(){console.log("Callingthisfunction");}}谢谢 最佳答案 我今天遇到了类似的问题。您可以将document.body更改为window:window.onload=function(){windo
在我的应用程序中，我使用List.js进行排序。所有“字符串”值都工作正常。但是我在列中确实有“修改日期”。当我单击“按日期修改”时-进行排序，这只是考虑日期值，文本是什么，例如:1/4/11..并相应地进行排序。由于这种方法，我得到了错误的排序顺序。我怎样才能改为按日期的数字的实际值排序？这是我的代码:newList('mfi-col2',{valueNames:['companyLegalName','phazeName','contactName','number','enrollId'
我的任务是将GCS添加到网站。在我按照说明创建我的免费GCS(http://www.google.com/cse/sitesearch/create)，并将提供的代码片段粘贴到适当的位置后，搜索框和按钮组件呈现OK，用户可以输入搜索字符串，运行搜索并查看结果。到目前为止，一切都很好。但是，当组件第一次呈现时，我希望能够将预先输入的字符串传递到框中并以编程方式立即执行搜索。这一点不起作用。我目前拥有的代码如下，包括提供的代码片段和一些额外的代码，这些代码是我阅读自定义搜索元素控件API文档(https://developers.google.com/custom-search/doc
我已经使用javascript工作了一个星期了。我目前正致力于通过节点使事情工作/改变。但我一直注意到一些奇怪的事情，对于一个不熟练的javascripter来说确实如此。我的网站结构如下:<html><head><title>....</title><link/><script></script></head><body><div1><div2></div></div></body></html>当我试图找
当我遇到麻烦时，我正在维护一些旧代码。我对这个正则表达式模式感到困惑:/^.*$/(作为textFieldValidation(this,'true',/^.*$/,'','中的参数提供)').我将此正则表达式解释为:/^=打开模式.=匹配任意值的单个字符(EOL除外)*=匹配0次或更多次$=匹配行尾/=关闭模式所以……我认为这个模式匹配所有内容，这意味着该函数除了浪费处理周期外什么都不做。我对么？ 最佳答案 它匹配单行文本。它将无法匹配多行字符串，因为^匹配输入的开头，而$匹配输入的结尾。如果中间有任何换行符(\n)或插入符返回(
这些文档并不是很有用-过于简短和模糊。据我了解docs，我们只需要在测试目录上运行casperjs命令并确保每个测试以Tester.done()结束。这是我的两个测试，//test1.jsvarcasper=require('casper').create();varurlPrefix="http://localhost/NavHawk2/";casper.start(urlPrefix,function(){this.test.assertSelectorHasText('title','Login','Titl
我需要解析一个包含长数字的json(这是在javaservlet中生成的)。问题是长数字会四舍五入。当这段代码被执行时:vars='{"x":6855337641038665531}';varobj=JSON.parse(s);alert(obj.x);输出是:6855337641038666000请在此处查看示例:http://jsfiddle.net/huqUh/这是为什么，我该如何解决？ 最佳答案 正如其他人所说，这是因为数字太大了。但是，您可以通过将数字作为字符串发送来解决此限制，如下所示:v
我试图在原型(prototype)对象上定义一个不可枚举的toJSON函数，但运气不佳。我希望得到类似于ECMAScript5toJSON的东西:Object.defineProperty(obj,prop,{enumerable:false});然而，这将它定义为一个不能作为方法访问的属性。[编辑:尼克错了；它可以作为一种方法来访问。他的错误在于此问题中未显示的代码-有关详细信息，请参阅他对下面答案的评论。]我希望能够以不可枚举的方式定义函数，因为我计划在所有基本类型的原型(prototype)中定义(String，Number、Boolean、Array和Object)，以便我可以
我正在使用BufferGeometry来绘制构成地形的数千个立方体，但是如果我需要更改其中一个立方体的位置，我很难找到如何更新几何体。例如，我有这段代码来初始化我的几何图形:(我正在对thisexample的更新版本进行测试)//12trianglespercube(6quads)vartriangles=12*150000;vargeometry=newTHREE.BufferGeometry();geometry.attributes={position:{itemSize:3,array:newFloat32Array(triangles*3*3),numItems:triang
我正在为我正在进行的一个漂亮的新项目创建多边形。每当您将鼠标悬停在infoWindow上时，就会出现问题，多边形上的mouseout事件会触发。除非鼠标移出多边形和信息窗口，否则我不希望触发mouseout事件。有任何想法吗？这是大部分相关代码。infoWindow=newgoogle.maps.InfoWindow({content:myContent});varpolygon=newgoogle.maps.Polygon({paths:polygonPath,strokeColor:data.color,strokeOpacity:0.5,strokeWeight:0,fillCo
以下代码适用于Firefox浏览器。但是，不是Chrome。下面的代码有什么问题？window.onload=function(){document.body.onscroll=Test.callFn;}varTest=newfunction(){this.callFn=function(){console.log("Callingthisfunction");}}谢谢 最佳答案 我今天遇到了类似的问题。您可以将document.body更改为window:window.onload=function(){windo
在我的应用程序中，我使用List.js进行排序。所有“字符串”值都工作正常。但是我在列中确实有“修改日期”。当我单击“按日期修改”时-进行排序，这只是考虑日期值，文本是什么，例如:1/4/11..并相应地进行排序。由于这种方法，我得到了错误的排序顺序。我怎样才能改为按日期的数字的实际值排序？这是我的代码:newList('mfi-col2',{valueNames:['companyLegalName','phazeName','contactName','number','enrollId'
我的任务是将GCS添加到网站。在我按照说明创建我的免费GCS(http://www.google.com/cse/sitesearch/create)，并将提供的代码片段粘贴到适当的位置后，搜索框和按钮组件呈现OK，用户可以输入搜索字符串，运行搜索并查看结果。到目前为止，一切都很好。但是，当组件第一次呈现时，我希望能够将预先输入的字符串传递到框中并以编程方式立即执行搜索。这一点不起作用。我目前拥有的代码如下，包括提供的代码片段和一些额外的代码，这些代码是我阅读自定义搜索元素控件API文档(https://developers.google.com/custom-search/doc
我已经使用javascript工作了一个星期了。我目前正致力于通过节点使事情工作/改变。但我一直注意到一些奇怪的事情，对于一个不熟练的javascripter来说确实如此。我的网站结构如下:<html><head><title>....</title><link/><script></script></head><body><div1><div2></div></div></body></html>当我试图找
当我遇到麻烦时，我正在维护一些旧代码。我对这个正则表达式模式感到困惑:/^.*$/(作为textFieldValidation(this,'true',/^.*$/,'','中的参数提供)').我将此正则表达式解释为:/^=打开模式.=匹配任意值的单个字符(EOL除外)*=匹配0次或更多次$=匹配行尾/=关闭模式所以……我认为这个模式匹配所有内容，这意味着该函数除了浪费处理周期外什么都不做。我对么？ 最佳答案 它匹配单行文本。它将无法匹配多行字符串，因为^匹配输入的开头，而$匹配输入的结尾。如果中间有任何换行符(\n)或插入符返回(
这些文档并不是很有用-过于简短和模糊。据我了解docs，我们只需要在测试目录上运行casperjs命令并确保每个测试以Tester.done()结束。这是我的两个测试，//test1.jsvarcasper=require('casper').create();varurlPrefix="http://localhost/NavHawk2/";casper.start(urlPrefix,function(){this.test.assertSelectorHasText('title','Login','Titl
我需要解析一个包含长数字的json(这是在javaservlet中生成的)。问题是长数字会四舍五入。当这段代码被执行时:vars='{"x":6855337641038665531}';varobj=JSON.parse(s);alert(obj.x);输出是:6855337641038666000请在此处查看示例:http://jsfiddle.net/huqUh/这是为什么，我该如何解决？ 最佳答案 正如其他人所说，这是因为数字太大了。但是，您可以通过将数字作为字符串发送来解决此限制，如下所示:v