- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我是 AngularJS 的新手,我有以下代码,我想根据用户输入动态过滤我显示的列表,有点像谷歌,我可以加载数据并将其显示在表格上,但是过滤器由于某些奇怪的原因,功能无法正常工作。如有任何帮助,我们将不胜感激。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="css/style.css">
<script src="js/angular.min.js"></script>
<title>IMDB Movies top 100</title>
</head>
<body>
<div class="container-fluid whole wrapper">
<div class="navbar navbar-default row col-xs-12 col-sm-12 col-md-12 col-lg-12 header">
<p class="navbar-brand header-text ">IMDB Top 100 Movies</p>
</div>
<div id="sidebar-wrapper">
<ul class="sidebar-nav">
<li><div class="form-group" style="width:500%;">
<input class="form-control" type="text" ng-model="search" placeholder="search..." />
</div></li>
<li class="sidebar-brand btn btn-default btn-custom"><a href="#">Create new entry</a></li>
<li class="sidebar-brand btn btn-default btn-custom"><a href="#">Update Entry</a></li><br>
<li class="sidebar-brand btn btn-default btn-custom"><a href="#">Delete Entry</a></li><br>
</ul>
</div>
<div ng-app="myApp" ng-controller="movieCtrl">
<table class="view table table-bordered table-striped" style="width:80%">
<thead>
<tr>
<th>Title</th>
<th>Rank</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="movie in movies | filter : {'movie.title': search}">
<td>{{movie.title}}</td>
<td>{{movie.rank}}</td>
</tr>
</tbody>
</table>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('movieCtrl', function ($scope, $http) {
$http.get("movies.json").then(function (response) {
$scope.movies = response.data;
});
});
</script>
</div>
</body>
我的 JSON 文件采用以下格式,
[
{
"title": "The Shawshank Redemption",
"rank": "1",
"id": "tt0111161"
},
{
"title": "The Godfather",
"rank": "2",
"id": "tt0068646"
}]
最佳答案
应该是这样的。删除电影
您还应该将 ng-app="myApp"
和 ng-controller="movieCtrl"
放在包含所有范围的位置。
在您的示例中,ng-model="search"
超出了 ng-app
<tr ng-repeat="movie in movies | filter : {'title': search}">
var app = angular.module('myApp', []);
app.controller('movieCtrl', function($scope, $http) {
$scope.movies = [
{
"title": "The Shawshank Redemption",
"rank": "1",
"id": "tt0111161"
},
{
"title": "The Godfather",
"rank": "2",
"id": "tt0068646"
}]
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="movieCtrl">
<input class="form-control" type="text" ng-model="search" placeholder="search..." />
<table class="view table table-bordered table-striped" style="width:80%">
<thead>
<tr>
<th>Title</th>
<th>Rank</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="movie in movies | filter : {'title': search}">
<td>{{movie.title}}</td>
<td>{{movie.rank}}</td>
</tr>
</tbody>
</table>
</div>
关于javascript - AngularJS 过滤器不适用于从 JSON 文件加载的数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44072406/
我在我的 Xcode 项目目录中输入了以下内容: keytool -genkey -v -keystore release.keystore -alias mykey -keyalg RSA \
假设我有一个像这样的 DataFrame(或 Series): Value 0 0.5 1 0.8 2 -0.2 3 None 4 None 5 None
我正在对一个 Pandas 系列进行相对繁重的应用。有什么方法可以返回一些打印反馈,说明每次调用函数时在函数内部进行打印还有多远? 最佳答案 您可以使用跟踪器包装您的函数。以下两个示例,一个基于完成的
我有一个 DataFrame,其中一列包含列表作为单元格内容,如下所示: import pandas as pd df = pd.DataFrame({ 'col_lists': [[1, 2
我想使用 Pandas df.apply 但仅限于某些行 作为一个例子,我想做这样的事情,但我的实际问题有点复杂: import pandas as pd import math z = pd.Dat
我有以下 Pandas 数据框 id dist ds 0 0 0 0 5 1 0 0 7 2 0 0
这发生在我尝试使用 Gradle 构建时。由于字符串是对象,因此似乎没有理由发生此错误: No signature of method: java.util.HashMap.getOrDefault(
您好,有人可以解释为什么在 remaining() 函数中的 Backbone 示例应用程序 ( http://backbonejs.org/examples/todos/index.html ) 中
我有两个域类:用户 class User { String username String password String email Date dateCreated
问题陈述: 一个 pandas dataframe 列系列,same_group 需要根据两个现有列 row 和 col 的值从 bool 值创建。如果两个值在字典 memberships 中具有相似
apporable 报告以下错误: error: unknown type name 'MKMapItem'; did you mean 'MKMapView'? MKMapItem* destina
我有一个带有地址列的大型 DataFrame: data addr 0 0.617964 IN,Krishnagiri,635115 1 0.635428 IN,Chennai
我有一个列表list,里面有这样的项目 ElementA: Number=1, Version=1 ElementB: Number=1, Version=2 ElementC: Number=1,
我正在编译我的源代码,它只是在没有运行应用程序的情况下终止。这是我得到的日志: Build/android-armeabi-debug/com.app4u.portaldorugby/PortalDo
我正在尝试根据另一个单元格的值更改单元格值(颜色“红色”或“绿色”)。我运行以下命令: df.loc[0, 'Colour'] = df.loc[0, 'Count'].apply(lambda x:
我想弄清楚如何使用 StateT结合两个 State基于对我的 Scalaz state monad examples 的评论的状态转换器回答。 看来我已经很接近了,但是在尝试申请 sequence
如果我已经为它绑定(bind)了集合,我该如何添加 RibbonLibrary 默认的快速访问项容器。当我从 UI 添加快速访问工具项时,它会抛出 Operation is not valid whi
在我学习期间Typoclassopedia我遇到了这个证明,但我不确定我的证明是否正确。问题是: One might imagine a variant of the interchange law
我是一名优秀的程序员,十分优秀!