[Update] It was a stupid typo on my part. Thank you dfsq!
There is a similar question here on SO, and my code follows the recommended answer, so please do not mark this as a duplicate.
In my localhost I get the following error: Error: [ng:areq] Argument 'PostCtrl' is not a function, got undefined
Contents of app.js:
/* global app:true */
/* exported app */
'use strict';
var app = angular
.module('redjsApp', [
'ngAnimate',
'ngCookies',
'ngResource',
'ngRoute',
'ngSanitize',
'ngTouch',
'firebase'
])
.constant('FIREBASE_URL', 'https://blazing-fire-6602.firebaseio.com/')
.config(function ($routeProvider) {
$routeProvider
.when('/', {
templateUrl: 'views/posts.html',
controller: 'PostCtrl'
})
.when('/about', {
templateUrl: 'views/about.html',
controller: 'AboutCtrl'
})
.otherwise({
redirectTo: '/'
});
});
Contents of scripts/services/post.js:
'use strict';
app.factory('Post', function ($firebase, FIREBASE_URL) {
var ref = new Firebase(FIREBASE_URL + 'posts');
var posts = $firebase(ref.child('posts')).$asArray();
console.log($firebase(ref.child('posts')).$asArray());
var Post = {
all: posts,
create: function (post) {
return posts.$add(post);
},
get: function (postId) {
return $firebase(ref.child('posts').child(postId)).$asObject();
},
delete: function (post) {
return posts.$remove(post);
}
};
return Post;
});
Contents of scripts/posts.js:
'use strict';
app.controller('PostsCtrl', function ($scope, Post) {
$scope.posts = Post.all;
$scope.post = {url: 'http://', 'title': ''};
$scope.submitPost = function () {
Post.create($scope.post).then(function () {
$scope.post = {url: 'http://', 'title': ''};
});
};
$scope.deletePost = function (post) {
Post.delete(post);
};
});
Contents of posts.html are :
<div ng-repeat="post in posts">
<a ng-href="{{ post.url }}">{{ post.title }}</a>
<a ng-click="deletePost(post)">delete</a>
</div>
</div>
<form ng-submit="submitPost()">
<input type="text" ng-model="post.title" />
<input type="text" ng-model="post.url" />
<input type="submit" value="Add Post" />
</form>
Posts: {{ posts}} <br />
Post: {{post}}
Only the html is rendered, none of the associated js is rendered.The app was scaffolded using yeoman. Help would be appreciated!
Your controller name has a typo:
app.controller('PostsCtrl', ...
while in the route it's
controller: 'PostCtrl'