gpt4 book ai didi

javascript - 获取 'md-select'找不到

转载 作者:行者123 更新时间:2023-11-30 15:34:59 24 4
gpt4 key购买 nike

尝试学习 Angular 的一些基础知识。我正在尝试在我的 json 文件中获取类别数据。我的 html 中有这个:

<md-input-container>
<label>Category</label>
<md-select>
<md-option ng-repeat="category in categories" value="{{category}}">
{{ category }}
</md-option>
</md-select>
</md-input-container>

我在我的 html 中包含了所有脚本:

<script src="node_modules/angular/angular.js"></script>
<script src="node_modules/angular-animate/angular-animate.js">
</script>
<script src="node_modules/angular-aria/angular-aria.js"></script>
<script src="node_modules/angular-material/angular-material.js"></script>
<script src="scripts/app.js"></script>
<script src="components/classifieds.ctr.js"></script>
<script src="components/classifieds.fac.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script>

在我的 Controller js 中,我包含了这个:

(function() {
"use strict";

angular
.module("ngClassifieds")
.controller("classifiedsCtrl", function($scope, $http, classifiedsFactory, $mdSidenav, $mdToast, $mdDialog) {


classifiedsFactory.getClassifieds().then(function(classifieds){
$scope.classifieds = classifieds.data;
$scope.categories = getCategories($scope.classifieds);

});


........
........

function getCategories(classifieds){
var categories =[];
angular.forEach(classifieds, function(item){
angular.forEach(item.categories, function(category){
categories.push(category);
});
});
return _.uniq(categories); //return all the unique
categories
}
});

})();

但不断收到错误提示 angular.js:14328 Error: [$compile:ctreq] Controller 'ngModel', required by directive 'mdSelect', cannot be found!

还有TypeError: Cannot read property '$render' of undefined

不确定我在这里做错了什么。任何帮助将不胜感激。

最佳答案

你需要有 ng-model 和 md-select

 <md-select ng-model="model">
<md-option ng-repeat="category in categories" value="{{category}}">
{{ category }}
</md-option>
</md-select>

演示

var app = angular.module('app', ["ngMaterial"]);
app.controller('myCtrl', function($scope) {
$scope.categories = [
"test1 with 001" ,
"test2 with 002"
];

});
<!DOCTYPE html>
<html ng-app="app">
<head>
<link rel="stylesheet" href="style.css" />
<link data-require="angular-material@0.11.0" data-semver="0.11.0" rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/0.11.0/angular-material.min.css" />
<script data-require="jquery@*" data-semver="2.1.4" src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
<script data-require="angular.js@*" data-semver="1.4.5" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script>
<script data-require="angular-material@0.11.0" data-semver="0.11.0" src="https://ajax.googleapis.com/ajax/libs/angular_material/0.11.0/angular-material.min.js"></script>
<script data-require="angular-animate@1.4.1" data-semver="1.4.1" src="https://code.angularjs.org/1.4.1/angular-animate.js"></script>
<script data-require="angular-aria@1.4.1" data-semver="1.4.1" src="https://code.angularjs.org/1.4.1/angular-aria.js"></script>
</head>
<body ng-controller="myCtrl">
<div layout="row">
<md-select placeholder="Select" ng-model="model">
<md-option ng-repeat="category in categories" value="{{category}}">
{{category}}
</md-option>
</md-select>
</div>
</body>

</html>

关于javascript - 获取 'md-select'找不到,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41688226/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com