gpt4 book ai didi

javascript - 将对象分配给 Angular js 中的属性,以尝试在另一个脚本标记中重用

转载 作者:行者123 更新时间:2023-11-28 02:54:43 25 4
gpt4 key购买 nike

我正在尝试使用 angular js 创建交互式体验。我想知道我是否可以创建属性、分配对象然后在“index.html”的脚本标记中实例化它们?

例如

var app = angular.module('myApp');

app.controller('MainController', ['$scope', function($scope) {
$scope.title = 'Barry Bounce';
$scope.barry = {
test1: function() {
return "My name is slim shady"
}

}

}]);

index.html如下

<!doctype html>
<html>
<head>

<title>Barry bounce</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.js"></script>

</head>
<body ng-app="myApp">


<div class="main" ng-controller="MainController">
<script> document.write(barry.test1)</script>


</div>

<!-- Modules -->
<script src="js/app.js"></script>

<!-- Controllers -->

<script src="js/controllers/MainController.js"></script>

</body>
</html>

然后使用 index.html 中脚本标记中的所有属性实例化 {{ Barry }}。

有没有更好的方法来解决这个问题,例如使用指令或工厂

P.S 我是 angular js 的新手,如有任何指导,我们将不胜感激。

最佳答案

在HTML中不需要实例化,在controller中声明后会自动实例化。要在 index.html 中获取该值,您可以使用 ng-model 进行绑定(bind)。

var app = angular.module('myApp');

app.controller('MainController', ['$scope', function($scope) { 
$scope.title = 'Barry Bounce';
$scope.barry = [
{test1:'"My name is slim shady"'},
];
}
}]);

<!doctype html>
<html>
<head>

HTML

<title>Barry bounce</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.js"></script>

</head>
<body ng-app="myApp">


<div class="main" ng-controller="MainController">
<span ng-model="barry.test1"> </span


</div>

<!-- Modules -->
<script src="js/app.js"></script>

<!-- Controllers -->

<script src="js/controllers/MainController.js"></script>

</body>
</html>

关于javascript - 将对象分配给 Angular js 中的属性,以尝试在另一个脚本标记中重用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37626640/

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