Я новичок в angularjs, и я пытаюсь отобразить два значения функции при загрузке страницы.
Я могу загрузить только одну функцию. Когда я пытаюсь загрузить два метода, загружается только первый метод init.
Затем я пытаюсь объявить общую функцию "data-ng-init =" initializeMethods() в html, но я не могу получить никакого значения.
Моя страница html
Я использовал общее имя функции init как "data-ng-init =" initializeMethods() ".
<div class="container-fluid text-center" ng-controller="UserDataController as ctrl" data-ng-init="initializeMethods()">
<div class="row content">
<div class="col-sm-2 sidenav">
<div class="well well-lg col-xs-30" style="background-color: green;" ng-show="true">
<img class="img-responsive" style="padding-bottom:10px;" src="css/images/image.jpg" />
<div class="form-group">
<select class="form-control" ng-model="model.selectedValue" name="groupzname">
<option ng-repeat="item in model.dropDownData track by $index" value="{{item}}">{{item}}</option>
</select>
</div>
</div>
<div class="collapse navbar-collapse navbar-ex1-collapse">
<ul class="nav navbar-nav">
<li><a href="#/dashboard"><span class="glyphicon glyphicon-dashboard vmenu"></span>Dashboard</a>
</li>
<li class="#/Profile"><a href="#/"><span class="glyphicon glyphicon-user vmenu"></span>Profile</a>
</li>
<li><a href="#/Account"><span class="glyphicon glyphicon-edit vmenu"></span>Account</a>
</li>
<li><a href="#/Dropbox"><span class="glyphicon glyphicon-tags vmenu"></span>Dropbox</a>
</li>
<li><a href="#/Checklist"><span class="glyphicon glyphicon-off vmenu"></span>Checklist</a>
</li>
<li><a href="#/Report"><span class="glyphicon glyphicon-off vmenu"></span>Report</a>
</li>
<li><a href="#/Settings"><span class="glyphicon glyphicon-off vmenu"></span>Settings</a>
</li>
<li><a href="#/Help"><span class="glyphicon glyphicon-off vmenu"></span>Help</a>
</li>
</ul>
</div>
</div>
<div class="col-sm-8 text-left" ng-show="true">
<h1>Welcome</h1>
<div class="form-group">
<label class="form-control" ng-model="model.membervalue" name="membername" style="border:none"> {{model.membervalue}}</label>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="panel panel-primary">
<div class="panel-heading"><img src="css/images/Birthday.png" />BIRTHDAYS TODAY</div>
<div class="panel-body">
<ul>
<li ng-repeat="data in displayBirthdays">{{data}}</li>
</ul>
</div>
</div>
Мой контроллер
Здесь общая функция "$ scope.initializeMethods = function() {", которая содержит в себе две разные функции: $ scope.getDisplayList = function() {" и " $ scope.Birthdays = function (data) {"
$scope.initializeMethods = function(){
$scope.getDisplayList = function(){
$scope.model.dropDownData = [];
console.log(displaynames);
for(var i=0; i<displaynames.length; i++)
{
$scope.model.dropDownData.push(displaynames[i].groupzname + " - "+displaynames[i].membername + " - "+displaynames[i].membercode); // we can itterate and set the drop down values
console.log($scope.model.dropDownData);
$scope.model.selectedValue =displaynames[i].groupzname + " - "+displaynames[i].membername + " - "+displaynames[i].membercode; // set model value
$scope.model.memberName = displaynames[i].membername;
}
$window.localStorage.x = $scope.model.dropDownData; //setting data in cookies
}
$scope.Birthdays = function(data){
var current_date = moment().format('YYYY-MM-DD');
var date_time = current_date + " 00:00:00";
var json = {
"json": {
"request": {
"servicetype": "21",
"functiontype": "2021",
"memberid": $rootScope.displayList[0].memberid,
"groupzcode": $rootScope.displayList[0].groupzcode,
"date":date_time,
"country": [
"India"
],
"state": [
"_ALL"
],
"city": [
"_ALL"
],
"segment": [
"_ALL"
],
"groupzlist":[
$rootScope.displayList[0].groupzcode
], "session_id":$rootScope.displayList[0].session_id,
}
}
}
UserService.Birthdays(json).then(function(response){
//callback(response);
var show_birthdays = [];
console.log("displayBirthdays");
if (response.json.response.statuscode != 0 && response.json.response.statusmessage !='Success') {
show_birthdays = response.json.response.statusmessage;
console.log("show_birthdays "+show_birthdays);
}else {
console.log("Greeting response: "+response);
var resp = response;
var greetings = resp.json.response.greetings;
console.log(greetings);
console.log(show_birthdays);
}
});
}
}
кто-нибудь может рассказать мне, как я могу отображать оба значения функции при загрузке страницы.
Заранее спасибо.
контроллер:
$scope.initializeMethods = initializeMethods;
$scope.getDisplayList = getDisplayList;
$scope.birthdays = birthdays;
// Init function when page load
$scope.initializeMethods();
function initializeMethods () {
$scope.getDisplayList();
$scope.birthdays();
}
function getDisplayList () {
// something
}
function birthdays () {
// something
}
Это написано на ES6, но вы получаете суть.
export default class MyController {
constructor() {
super(arguments);
this.MakeInitCall();
}
MakeInitCall() {
// Your initialisation code here, gets called on controller (page) start;
this.getDisplayList();
this.Birthdays(data);
}
getDisplayList() {
$scope.whatevervariable = 'foo';
}
Birthdays(data) {
$scope.anothervariable = 'bar';
}
}
Вы можете переписать для ES5 и т.
На самом деле ваша функция initializeMethods просто объявляет функции getDisplayList и Birthdays. Если вы вызовете оба из них в конце инициализацииMethods, он должен работать:
$scope.initializeMethods = function(){
$scope.getDisplayList = function(){...}
$scope.Birthdays = function(){...}
$scope.getDisplayList();
$scope.Birthdays();
}
data-ng-init="getDisplayList();Birthdays()