Angularjs :如何用 Laravel 显示 ng-repeat 的内容
Angularjs : how to show contents of ng-repeat with Laravel?
我一直在尝试显示ng-repeat
的内容。我使用 Laravel 5.2,这显然使这项任务更加复杂。
如果您还没有尝试过,让我解释一下使用双花括号(例如 {{ value }}
)将找到一个php变量($value
),而不是Angular控制器中的属性,如果你使用Laravel。
这可以通过前面的@
来解决,根据拉拉维尔的文档。另外,我了解到除了{{ value }}
之外,还有其他一些方法可以显示变量。不过,我无法在 HTML 上显示 ng-repeat
的值。
我的代码如下所示。
<div ng-app="angularApp" ng-controller="TableController as tc">
<table>
<tr ng-repeat="s in tc.data.students">
<td>@{{ s.name }}</td> //1st attempt
<td>@{!! s.name !!}</td> //2nd attempt
<td ng-bind="s.name"></td> //3rd attempt
</tr>
</table>
<script type="text/javascript">
angular.module('angularApp', [])
.controller('TableController', function(){
this.data = {
students: [
@foreach($students as $student)
"{!! $student !!}", //This can be replaced with {{ $student }}
@endforeach
]
};
});
</script>
$students
是一个数组,包含名为 student
的 SQL 对象。这来自拉拉维尔的控制器功能。
编辑我通常将$scope
用于控制器属性,但在这种情况下,我必须对控制器使用as
语法。因此,我不能使用 $scope
来存储控制器的变量。
你看到我做错了什么吗?任何建议将不胜感激!
试试这样
<script type="text/javascript">
angular.module('angularApp', [])
.controller('TableController', function($scope){
$scope.data = {
students: [
@foreach($students as $student)
"{!! $student !!}",
@endforeach
};
});
</script>
这就是我做同样的事情的方式:
视图:
<div ng-app="angularApp" ng-controller="TableController">
<input type="text" ng-model="searchBox">
<table style="width:100%;">
<tr ng-repeat="student in students">
<td>@{{ student.name }}</td>
</tr>
</table>
控制器:
angular.module('angularApp', [])
.controller('TableController', function($scope){
$scope.students: [
@foreach($students as $student)
"{!! $student !!}", //This can be replaced with {{ $student }}
@endforeach
];
});
$scope
是 Angular 中的一个基本概念:它使数据在范围内(在控制器或视图中)可用。这里有一些文档:https://docs.angularjs.org/tutorial/step_04
我建议您完成官方的Angular教程,它会对您有很大帮助。
相关文章:
- AngularJS ng repeat显示原型函数未定义
- 尝试使用 AngularJS ng-repeat 显示 JSON 数据不起作用
- 如何在使用 ng-repeat 显示表数据时放置条件新行
- 角度.js - 将带有特殊字符和数字的字符串转换为数组并使用 ng-repeat 显示
- 如何使用 ng-repeat 显示 JSON 对象
- 以 ng-repeat 显示来自 Firebase 的数据
- 如何使用 Angular.js ng-repeat 显示表中的数据数组
- ng-repeat显示的行等于属性的数量,甚至不在HTML视图上显示数据
- 如何在angularjs中使用ng-repeat显示JSON数组
- 保持使用 AngularJS ng-repeat 显示的结果数量的计数
- 如何使用ng-repeat显示带有条件的json数组
- 如何使用angularjs ng-repeat显示html页面中每个
- 使用ng-repeat显示错误
- 用ng-repeat显示有角度的TAB
- 如何在angularjs中使用ng-repeat显示一个集合
- 无法使用Angular ng-repeat显示数组
- 如何在Ionic框架下使用ng-repeat显示嵌套的JSON对象
- 在Angular JS中使用ng-repeat显示元素会延迟10秒以上
- 使用输入类型=文件选择文件并使用ng-repeat显示路径后触发函数
- AngularJS - 使用单个ng-repeat显示复杂的JSON数据