Angular Ajax调用,ng-repeat未显示
Angular Ajax call, ng-repeat not showing
var app = angular.module('app' , ['ui.router']);
app.controller('HeaderController',function( $scope , $http ){
$http.get("/data/main_menu.php")
.success(function(data){
$scope.Menus = data;
});
});
HTML <header ng-controller="HeaderController as header">
<ul id="menu_categories">
<li ng-repeat="menu in header.Menus">{{ menu.name }}</li>
</ul>
/数据/main_menu.php
<?php
$menu = array(
array('name' => 'FACE'),
array('name' => 'BODY'),
array('name' => 'HAIR'),
array('name' => 'MEN'),
array('name' => 'BABIES & KIDS'),
array('name' => 'SUN'),
array('name' => 'AROMATHERAPY')
);
echo json_encode($menu);
?>
我尝试在控制器中更新函数或定义$范围。$http.get
之外的菜单你能帮我……吗?可能是一些小的东西!如果您使用控制器作为语法,您不应该再将Menus
对象分配给$scope
。相反,您可以设置相应的this
属性(控制器对象的属性,而不是$scope
对象的属性):
app.controller('HeaderController', function($scope, $http) {
var self = this;
$http.get("/data/main_menu.php").success(function(data){
self.Menus = data;
});
});
我使用self
引用,因为在成功回调中this
指向不同的上下文,而不是控制器。
在这里阅读不同的控制器声明样式。
如果你想用$scope.Menus = data;
的方式,ngRepeat
应该看起来像<li ng-repeat="menu in Menus">{{ menu.name }}</li>
。使用controller-as声明,当然您仍然可以使用$scope
对象
header。菜单不正确,您必须使用菜单代替。这样的
<header ng-controller="HeaderController">
<ul id="menu_categories">
<li ng-repeat="menu in Menus">{{ menu.name }}</li>
</ul>
相关文章:
- Angular js将只显示ng repeat中的第一个元素
- AngularJS ng repeat显示原型函数未定义
- ng-repeat不显示任何内容
- 尝试使用 AngularJS ng-repeat 显示 JSON 数据不起作用
- 根据条件使用ng repeat动态显示输入复选框
- AngularJS:如何使用ng repeat来显示父数组中包含的数组的所有元素
- 在ng repeat中显示嵌套的json
- 如何在使用 ng-repeat 显示表数据时放置条件新行
- Angularjs :如何用 Laravel 显示 ng-repeat 的内容
- ng-repeat / ng-bind 不会显示我的数据
- 角度.js - 将带有特殊字符和数字的字符串转换为数组并使用 ng-repeat 显示
- 拆分一个 json 并使用 ng-repeat 角度指令显示它
- AngularJS “ng-repeat |滤波器:..“没有像我预期的那样工作(不显示任何数据)
- ng-repeat在执行过程中显示不同的值
- AngularJs 在 ng-repeat 中显示/隐藏子标题
- ng-repeat之后的AngularJS NanoScroller没有显示
- 如何在Angular/Meteor中有条件地显示ng repeat内的按钮
- 显示ng-repeat中重复项的计数
- 在angular js中,单击按钮时,高亮显示ng-repeat表中出现的文本框
- 有一个JSON需要突出显示ng repeat中与JSON中的答案匹配的答案