c# - Failed to instantiate module RESTClientModule due to -
currently working wcf project.i trying consuming wcf service in anjular javascript using mvc. getting following error when lunch developer tools in google chrome.but when run application in google chrome gives me following errors , unable display data database , can not perform insert update , delete operation. wcf service working fine angularjs application not working. added angularjs javascript package in project .this code controller. name of controller crud_angularjs_restcontroller.i receiving 2 errors ....
angular.js:4957 uncaught error: [$injector:modulerr] failed instantiate module restclientmodule due to: error: [$injector:nomod] module 'restclientmodule' not available! either misspelled module name or forgot load it. if registering module ensure specify dependencies second argument.
here html code..... <html data-ng-app="restclientmodule"> @{ viewbag.title = "manage student information using angularjs, wcf rest & mvc4"; } <body> <table id="tblcontainer" data-ng-controller="crud_angularjs_restcontroller"> <tr> <td> <table style="border: solid 2px green; padding: 5px;"> <tr style="height: 30px; background-color: skyblue; color: maroon;"> <th></th> <th>id</th> <th>name</th> <th>email</th> <th>class</th> <th>year</th> <th>city</th> <th>country</th> <th></th> <th></th> </tr> //inside tbody section using ng-repeat directive display record //database <tbody data-ng-repeat="stud in students"> <tr> <td></td> <td><span>{{stud.studentid}}</span></td> <td><span>{{stud.name}}</span></td> <td><span>{{stud.email}}</span></td> <td><span>{{stud.class}}</span></td> <td><span>{{stud.enrollyear}}</span></td> <td><span>{{stud.city}}</span></td> <td><span>{{stud.country}}</span></td> <td> <input type="button" id="edit" value="edit" data-ng-click="get(stud)" /></td> <td> <input type="button" id="delete" value="delete" data-ng-click="delete(stud)" /></td> </tr> </tbody> </table> </td> </tr> <tr> <td> <div style="color: red;">{{message}}</div> <table style="border: solid 4px red; padding: 2px;"> <tr> <td></td> <td> <span>student id</span> </td> <td> <input type="text" id="studentid" readonly="readonly" ng-model="studentid" /> </td> </tr> <tr> <td></td> <td> <span>student name</span> </td> <td> <input type="text" id="sname" required data-ng-model="name" /> </td> </tr> <tr> <td></td> <td> <span>email</span> </td> <td> <input type="text" id="semail" required data-ng-model="email" /> </td> </tr> <tr> <td></td> <td> <span>class</span> </td> <td> <input type="text" id="sclass" required data-ng-model="class" /> </td> </tr> <tr> <td></td> <td> <span>enrollement year</span> </td> <td> <input type="text" id="senrollyear" required data-ng-model="enrollyear" /> </td> </tr> <tr> <td></td> <td> <span>city</span> </td> <td> <input type="text" id="scity" required data-ng-model="city" /> </td> </tr> <tr> <td></td> <td> <span>country</span> </td> <td> <input type="text" id="scountry" required data-ng-model="country" /> </td> </tr> <tr> <td></td> <td></td> <td> <input type="button" id="save" value="save" data-ng-click="save()" /> <input type="button" id="clear" value="clear" data-ng-click="clear()" /> </td> </tr> </table> </td> </tr> </table> </body> </html> ///script reference <script src="~/scripts/myscripts/modules.js"></script> <script src="~/scripts/angular.js"></script> <script src="~/scripts/angular.min.js"></script>
here angular js code....the name of module restclientmodule.
/// <reference path="../angular.min.js" /> var app; (function () { app = angular.module("restclientmodule" , []); app.controller("crud_angularjs_restcontroller", function ($scope, crud_angularjs_restservice) { $scope.opertype = 1; //1 mean new entry getallrecords(); //to records function getallrecords() { var promiseget = crud_angularjs_restservice.getallstudent(); promiseget.then(function (pl) { $scope.students = pl.data }, function (errorpl) { $log.error('some error in getting records.', errorpl); }); } //to clear input controls. function clearmodels() { $scope.opertype = 1; $scope.studentid = ""; $scope.name = ""; $scope.email = ""; $scope.class = ""; $scope.enrollyear = ""; $scope.city = ""; $scope.country = ""; } //to create new record , edit existing record. $scope.save = function () { var student = { name: $scope.name, email: $scope.email, class: $scope.class, enrollyear: $scope.enrollyear, city: $scope.city, country: $scope.country }; if ($scope.opertype === 1) { var promisepost = crud_angularjs_restservice.post(student); promisepost.then(function (pl) { $scope.studentid = pl.data.studentid; getallrecords(); clearmodels(); }, function (err) { console.log("some error occured" + err); }); } else { //edit record debugger; student.studentid = $scope.studentid; var promiseput = crud_angularjs_restservice.put($scope.studentid, student); promiseput.then(function (pl) { $scope.message = "student updated successfuly"; getallrecords(); clearmodels(); }, function (err) { console.log("some error occured." + err); }); } }; //to student detail on base of student id $scope.get = function (student) { var promisegetsingle = crud_angularjs_restservice.get(student.studentid); promisegetsingle.then(function (pl) { var res = pl.data; $scope.studentid = res.studentid; $scope.name = res.name; $scope.email = res.email; $scope.class = res.class; $scope.enrollyear = res.enrollyear; $scope.city = res.city; $scope.country = res.country; $scope.opertype = 0; }, function (errorpl) { console.log('some error in getting details', errorpl); }); } //to delete record $scope.delete = function (student) { var promisedelete = crud_angularjs_restservice.delete(student.studentid); promisedelete.then(function (pl) { $scope.message = "student deleted successfuly"; getallrecords(); clearmodels(); }, function (err) { console.log("some error occured." + err); }); } }); // application service running in localhost under pot number 50028 . name of wcf service student service app.service("crud_angularjs_restservice", function ($http) { //create new record this.post = function (student) { var request = $http({ method: "post", url: "http://localhost:50028/studentservice.svc/addnewstudent", data: student }); return request; } //update record this.put = function (studentid, student) { debugger; var request = $http({ method: "put", url: "http://localhost:50028/studentservice.svc/updatestudent", data: student }); return request; } this.getallstudent = function () { return $http.get("http://localhost:50028/studentservice.svc/getallstudent"); }; //get single records this.get = function (studentid) { return $http.get("http://localhost:50028/studentservice.svc/getstudentdetails/" + studentid); } //delete record this.delete = function (studentid) { var request = $http({ method: "delete", url: "http://localhost:50028/studentservice.svc/deletestudent/" + studentid }); return request; } }); });
here screen shoot when run application.. click here see out put
please me correct error..
Comments
Post a Comment