Currently learning AngularJS and utilizing Restangular to communicate with a Rails server API. Struggling with grasping the concept of assigning form parameters to a variable in order to use it within my function for posting to the Rails API.
Below is an excerpt of my controller:
.controller('NewCtrl', ["$scope", "Restangular", function($scope, Restangular) {
var passages = Restangular.all('passages');
var allPassages = passages.getList();
var newPassage = {
book: $scope.passages.book
};
$scope.add = function() {
passages.post(newPassage);
};
This is how my form looks like:
<h1>Add New Passage</h1>
<form name="myForm" ng-submit="add()" ng-controller="NewCtrl" class="my-form">
Book: <input name="passages.book" required><span class="error" ng-show="myForm.input.$error.required">Required!</span><br>
<input type="submit" id="submit" value="Submit" />
</form>
Encountering the following error in the javascript console:
TypeError: Cannot read property 'book' of undefined
at new <anonymous> (http://localhost:9000/scripts/controllers/main.js:38:27)
at invoke (http://localhost:9000/bower_components/angular/angular.js:3000:28)
at Object.instantiate (http://localhost:9000/bower_components/angular/angular.js:3012:23)
at http://localhost:9000/bower_components/angular/angular.js:4981:24
at update (http://localhost:9000/bower_components/angular/angular.js:14509:26)
at Object.Scope.$broadcast (http://localhost:9000/bower_components/angular/angular.js:8468:28)
at http://localhost:9000/bower_components/angular/angular.js:7614:26
at wrappedCallback (http://localhost:9000/bower_components/angular/angular.js:6995:59)
at wrappedCallback (http://localhost:9000/bower_components/angular/angular.js:6995:59)
at http://localhost:9000/bower_components/angular/angular.js:7032:26
Seems like I'm missing a crucial step in effectively assigning form values using $scope to a variable. When using a static value like book: "Ephesians," everything functions smoothly. Appreciate any guidance on resolving this issue.