angular报错

最新推荐文章于 2023-03-31 14:44:53 发布

生晓乐

最新推荐文章于 2023-03-31 14:44:53 发布

阅读量681

点赞数

CC 4.0 BY-SA版权

分类专栏： IT类

本文链接：https://blog.youkuaiyun.com/qq_30580925/article/details/68929123

IT类专栏收录该内容

6 篇文章

订阅专栏

本文探讨了在Angular应用中遇到的面包屑导航报错问题。通过分析`breadcrumb.html`文件的代码，重点关注`ng-repeat`、`ng-class`和`ng-if`指令的使用，解释了错误产生的原因，并提供了相应的解决策略。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>封装一个面包屑导航</title>

<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css">
<script src="bower_components/angular/angular.js"></script>

</head>

<body ng-app="myAppDemo" ng-controller="myAppController">

<breadcrumb data='{{pathData}}'></breadcrumb>
<script>
//声明我们的模块 myApp
let myApp = angular.module('myAppDemo', []);
/*在模块写创建一个控制器 myAppController*/
myApp.controller('myAppController', ['$scope', function($scope){
/*定义一个数组*/
$scope.pathData = {
first:'#',
second:'#',
third:'#',
fourth:'#',
};
}]);

//定义一个面包屑导航指令
myApp.directive('breadcrumb', [function(){
/*返回指令对象*/
return{
scope:{},
templateUrl:'temps/breadcrumb.html',
replace:true,
link:function(scope, element, attributes){
scope.data = JSON.parse(attributes.data);
console.log(scope.data);
}
};
}]);
</script>
</body>

</html>

/**

breadcrumb.html文件