Angular 怎么在页面渲染的时候就传参并调用函数

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

已注册用户请登录

请不要在回答技术问题时复制粘贴 AI 生成的内容

这是一个创建于 2076 天前的主题，其中的信息可能已经有所发展或是发生改变。

第一次在论坛发帖，不太会表达问题这里是 html 代码

<section id="content" ng-cOntroller="indexCtrl" ng-init="a=$!userID"> <a href="#" ng-click = "playMusic(music,a)"><i class="icon-control-play i-2x"></i></a> </section>

下面是 angularJS 部分，可以看到 fetchMusicList(userID)方法是页面打开的时候就运行的，我就是想问问，这个 userID 有什么办法传给 fetchMusicList(userID)。

var app = angular.module('music', []); app.controller('indexCtrl', function ($http, $scope) { $scope.userArtist = {}; $scope.fetchMusicList = function (userID) { alert(userID); $http.get('sys/user/musiclist').success(function (data) { $scope.musics = data; }); $http.get('sys/user/recommendlist').success(function (data) { $scope.mus = data; console.log(userID); }); }; $scope.playMusic = function (userArtist, userID) { alert("使用者 id"+userID); userArtist.userID = userID; alert(userArtist.id); userArtist.musicId = userArtist.id; $http.post('sys/user/playMusic/', userArtist).success(function (result) { if ("succ" == result) alert("succ!") else alert("fail!") }); }; //这里以为 ng-init 会直接把 a 给 js 脚本,但是不行。 $scope.fetchMusicList(a); });

7 条回复 2020-03-04 09:06:24 +08:00

sunbuhui

2020-03-03 17:23:10 +08:00 via iPhone

顶一顶

noobma

2020-03-03 18:32:36 +08:00

后端渲染的时候，放模版里面

yimity

2020-03-03 18:38:47 +08:00

ng-init="user=$!userID"
app.controller('indexCtrl', function ($http, $scope) {
$scope.user = null;
$scope.userArtist = {};
$scope.fetchMusicList = function (userID) {

或者增加一个
ng-init="setUser($!userID)"
$scope.user = null;
$scope.setUser = (user) => { $scope.user = user; };

sunbuhui

2020-03-03 18:46:59 +08:00 via iPhone

@noobma 谢谢啦！

sunbuhui

2020-03-03 18:47:15 +08:00 via iPhone

@yimity 万分感谢！感谢抽出时间

sunbuhui

2020-03-03 19:44:23 +08:00

@yimity
```
var app = angular.module('music', []);
app.controller('indexCtrl', function ($http, $scope) {
$scope.userArtist = {};
$scope.user = null;
$scope.fetchMusicList = function (userID) {
alert($scope.user)
$http.get('sys/user/musiclist').success(function (data) {
$scope.musics = data;
});
$http.get('sys/user/recommendlist').success(function (data) {
$scope.mus = data;
});
};
$scope.playMusic = function (userArtist, userID) {
alert($scope.user);
userArtist.userID = userID;
alert(userArtist.id);
userArtist.musicId = userArtist.id;
$http.post('sys/user/playMusic/', userArtist).success(function (result) {
if ("succ" == result) alert("succ!")
else alert("fail!")
});
};
$scope.fetchMusicList($scope.user);

});
```
<section id="content" ng-cOntroller="indexCtrl" ng-init="user=$!userID">

前辈打扰了，按照你的方法修改了代码，但是每次页面重新渲染的时候弹窗提醒还是 null，不过$scope.user 的确是 userID 了。

yimity

2020-03-04 09:06:24 +08:00

@sunbuhui 重新渲染是什么意思？如果是路由导航进来然后再导航出去，再进来，这种的，你把 user 绑定到更高层级，甚至 rootScope 上。如果是刷新的话，那和第一次进来是一样的啊。