I am working on a Simple *Gmail* like Project According to
angularjs-tutorial-build-a-gmail-clone
<http://www.thinkful.com/learn/angularjs-tutorial-build-a-gmail-clone/Directives-Overview#Factories-and-Directives-Working-Together>
tutorial.
I want to write that step by step from scratch. But in Factories and
Directives Working Together I have a Problem.
This is Factory :
gmailApp.factory('inboxPageFactory', function inboxPageFactory($http,
$location) {
'use strict';
var exports = {};
exports.all_emails = [];
exports.getMessages = function () {
return $http.get('emails.json')
.error(function () {
console.log('An error Occurred :(');
}).success(function (data) {
exports.all_emails = data;
})
};
exports.openMessage = function (id) {
$location.path('inbox/email/' + id);
};
return exports;
});
And this is my directive definition :
gmailApp.directive('myInbox', function () {
return {
restrict: "E",
replace: true,
scope: true,
templateUrl: 'directives/inbox-directive.tmpl.html',
controllerAs: 'iCrtl',
controller: function (inboxPageFactory) {
this.messages = [];
this.msg = "This is a Simple Message";
this.openMessage = function (email_id) {
inboxPageFactory.openMessage(email_id)
};
inboxPageFactory.getMessages()
.then(angular.bind(this, function then() {
this.messages = inboxPageFactory.all_emails;
//console.log(this.messages.length);
}))
}
}});
And this is directive template that lists All Emails:
<div class="my-inbox">
{{iCtrl.msg}}
<div class="alert alert-success">You have {{iCrtl.messages.length}}
messages</div>
<table class="table table-bordered" ng-show="iCrtl.messages.length > 0 ">
<tr>
<th>From</th>
<th>Subject</th>
<th>Date</th>
<th>Action</th>
</tr>
<tr ng-repeat="email in iCrtl.messages">
<td>{{ email.from}}</td>
<td>{{ email.subject}}</td>
<td>{{ email.date | date : 'medium'}}</td>
<td>
<a href="#" ng-click="iCtrl.openMessage(email.id);" class="btn
btn-primary btn-xs">
<span class="fa fa-eye"></span>
Open Mail
</a>
<a href="#" ng-click="iCtrl.deleteEmail(email.id);" class="btn
btn-danger btn-xs">
<span class="fa fa-remove"></span>
Remove Mail
</a>
</td>
</tr>
</table>
</div>
Now , I can access to messages property defined in directive definition But
when I access to another simple property like msg to show *This is a Simple
Message* text , it returns no things. also calling openMessage method in
directive does no action.
what is Problem?
--
You received this message because you are subscribed to the Google Groups
"AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
