javascript - AngularJS 1 - 如何将 app.js 值列表传递给controller.js

标签 javascript angularjs angularjs-scope

这是关于 Angular JS One 的,所以我在我的 plunkr 中创建了一个简单的应用程序。 我做了什么? ,我创建了一个名为 app.js 的工厂和一个 myController.js。

问题是来自controller.js的Get方法,我不知道如何正确编写它,以便它将数据列表传递到html。请检查 getData(app.js) 和 Get(controller.js) 方法。有哪些错误?

注意:使用我需要的这三个层(应用程序-> Controller -> View ),添加和编辑工作正常。

PS:我还没有尝试过。

谢谢!!! 约翰

下面是我的 app.js 或业务

    angular.module('myFirstApp',['ngRoute'])

.config(function($routeProvider){
  $routeProvider
  .when('/home',{templateUrl : 'home.html'})
  .when('/people',{templateUrl : 'people.html'})
  .when('/about',{templateUrl : 'about.html'})
  .when('/contact',{templateUrl : 'contact.html'})

})


.factory('personFactory',function(){

    function getData(){

      $http.get('iphone.json').success(function(result){
      return  result;
      }).error(function(error){
      alert(error.error + "/" + error.statusCode);
      });

    }


    function insertData(Name,Email,Password,Mobile){

      //update data to database
      var x = "Record added successfuly.";
      return x;
    }


    function updateData(){ 

      //update data to database
      var x = "Record updated successfuly.";
      return x;
    }


    return {
        getData : getData,
                insertData,
                updateData


            };


  })

下面是我的controller.js

   angular.module('myFirstApp')

.controller('myController',function($scope,$http,personFactory){


  $scope.Add = function(){
    var x = personFactory.insertData($scope.Name,$scope.Email,$scope.Password,$scope.Mobile,$scope.result);
    $scope.Message = x;
    return $scope.Message;
  }


  $scope.Edit = function(){
    var x = personFactory.updateData();
    $scope.Message = x;
  return $scope.Message;
  }


   $scope.Get = function(){
    var x = personFactory.getData();
    $scope.PeopleList = x;
    return $scope.PeopleList;
  }



})

以下是我的看法

    <html>
  <head>

  <title></title>
  <script src="app.js"></script>
  </head>
  <body>
    <p>People</p>

    <table ng-controller='myController'>
      <thead>
        <tr>
        <th>Name</th>
        <th>Email</th>
        <th>Model</th>
        <th>Status</th>
        <th>Purchased on</th>
        </tr>
        </thead>
      <tr ng-repeat="values in PeopleList">
        <td>{{values.name}}</td>
        <td>{{values.email}}</td>
        <td>{{values.model}}</td>
        <td>{{values.status}}</td>
        <td>{{values.purchasedate}}</td>
        </tr>
      </table>
  </body>
</html>

最佳答案

工厂需要返回一个封装了所有功能的JS对象,就像这样

   // Data factory
   app.factory("Data", function () {
      return {
         add: function () {
            // add logic here
         },
         get: function () {
            // get logic here
         }
      }
   }

关于javascript - AngularJS 1 - 如何将 app.js 值列表传递给controller.js,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42755204/

相关文章:

javascript - AngularJs - 在 <img> 标签的 onclick 事件上调用 $scope 函数

angularjs - 在 AngularJS 和 Ionic 上渲染列表之前等待异步数据

javascript - 当用户在输入文本框中键入内容时,绑定(bind)丢失的一种方式

javascript - 服务调用后, Angular 方法未在 Controller 中触发

javascript - jQuery 实时悬停

javascript - 基于 scrollTop 和 scrollUp 的站点标题是否可见?

javascript - AngularJS — 指令 $将计算表达式解析到作用域对象上

AngularJS : ng-repeat filter when value is greater than

javascript - jQuery data() 类型转换问题?

javascript - symbian 的位置数据