Angular JS中未显示文本
Text not showing in Angular JS
我有这样的代码,它应该显示一个h4,如果搜索查询与任何字符串都不匹配,则表示没有产品。我现在有一个奇怪的错误,我的文本没有显示。它在html和css(控制台)中可用,在我单击绑定了click()的元素或在css(控制台中编辑颜色后即可工作。有人知道这可能是什么吗?我怎么能解决这个问题?我试过很多东西,但似乎都无济于事?
我是这样添加的->
<h4 ng-show="filteredItems.length == 0" class="explanation">We found no products</h4>
css
h4 {
color: #ccc;
text-align: center;
padding: 100px 20px;
}
搜索
$scope.searchItem = function( query ) {
foundItems = [];
query.toLowerCase();
if( searchTimeout )
$timeout.cancel( searchTimeout );
searchTimeout = $timeout( function() {
for( var i = 0; i < $scope.items.length; i++ ) {
if( $scope.items[i].name.toLowerCase().indexOf( query ) > -1 )
foundItems.push( $scope.items[i] );
}
$scope.filteredItems = foundItems;
}, 400);
}
编辑
// fill with dummy data
$scope.define = function() {
var random;
for( var i = 0; i < 114; i++ ) {
random = Math.floor(Math.random() * 6) + 1;
var text;
switch( random ) {
case 1:
text = 'Double espresso';
break;
case 2:
text = 'Frappuccino cookie crumble chocolate'
break;
case 3:
text = 'Cappuccino'
break;
case 4:
text = 'Very Berry Hibiscus Starbucks Refreshers™ Beverage'
break;
case 5:
text = 'Clover® Brewed Coffee Coffee Traveler'
break;
case 6:
text = 'Featured Dark Roast'
break;
default:
text = 'Not defined'
}
$scope.data.items.push( { name: text, image: random } );
}
// THIS LINE CAUSES THE PROBLEM ( uncommented everything works )
//$scope.data.filteredItems = $scope.data.items;
}
$scope.define();
试试这个plnkr。我让它运行并做我认为你想让它做的事情。我总是在任何范围值之前,即$scope.data.query
,而不仅仅是$scope.query
。这有助于防止视图试图在其作用域而不是控制器的作用域上使用值。
此外,由于您使用的是ng模型,我看不出将值从视图传递给控制器的原因,因为控制器已经有了它。这就是为什么ng change现在只调用searchItems()
相关文章:
- xmlhttp.responseText不显示文本
- 如何在MVC中使用jQuery在文本框旁边显示文本
- 根据页面的位置突出显示文本中的字符
- 当选择值x时,Javascript需要在正确的位置显示文本区域,从而循环通过具有选择选项的表单
- 操作javascript变量[HTML]以只显示文本
- 如何显示文本长度,即使它超过ng最大长度
- 如何在悬停时显示文本而不移动页面上的内容
- ASP.NET MVC,在文本框旁边显示文本
- 可单击滚动图像以显示文本框
- 使用鼠标悬停JavaScript/HTML显示文本
- 延迟高亮显示文本区域中的文本
- 选择“选择选项”时显示文本.怎么做
- 无法使用JavaScript在画布上显示文本
- 在不更改HTML源代码的情况下,在管理员TinyMCE编辑器中突出显示文本
- 将鼠标悬停在图像上时显示文本
- javascript:在for循环中使用settimeout来定期显示文本
- 一页主题搜索/用下一个按钮突出显示文本
- JavaScript 在更改选择时不显示文本区域
- 用于突出显示文本的JQuery/JavaScript插件
- 模式显示文本区域内容不是字符串