Инъекционные заводы в контроллеры с угловыми js

Question

Я работаю, чтобы получить более глубокое понимание фабрик и конструкторов. Я немного смущен, однако, о том, где разместить экземпляры и как их распечатать. Я возвращаюсь. Пластина не определена.

Вот как я настроил файл мой JS

var app = angular.module('dinerApp', ['ngRoute']); 
app.config(function($routeProvider){ 
    $routeProvider.when('/basque',{ 
    templateUrl:"./client/app.html", 
    controller: 'AppCtrl' 
    }) 
    .when('/menu',{ 
    templateUrl:"./client/menu.html", 
    controller:'MenuCtrl' 
    }) 
    .otherwise({ 
    redirectTo: '/basque' 
    }); 
}); 

Вот мой завод я поместил конструктор и его прототип на заводе-изготовителе. Я работаю над созданием основного меню ресторана.

app.factory('diner', function($q,$http){ 

    var Plate = function(name, description, price, ingredients){ 
    this.name = name; 
    this.description =description; 
    this.price = price; 
    this.ingredients = ingredients; 
    }; 

    Plate.prototype.toString= function(){ 
    var returnString='' ; 
    returnString += "name" + this.name + "\n" + 
    "description: " + this.description + "\n" + 
    "price: " + this.price + "\n"; 

    return returnString; 
    }; 

    return Plate; 
}) 

Ниже мой контроллер. Я создал несколько экземпляров.

app.controller('MenuCtrl',function($scope,diner){ 

var steakSandwich= new diner.Plate('Steak Sandwich', 'Something nice and tasty', 11.75); 
var lambShoulderSteak = new Plate('Lamb Shoulder Steak','Something Different', 11.75); 
var lambChops = new Plate('Lamb Chops', 'why not', 14.75); 
var chickenSandwich = new Plate('chicken Breast Sandwich', 'basque chicken on a bun',9.75); 
var basqueBurger = new Plate('Basco Burger', 'a better burger', 9.75); 

$scope.plates = diner.Plate; 
}); 

В моем HTML я бы в идеале называть нг повторами

<ul ng-repeat="plate in plates"> 
    <li>{{plate.name}} </li> 
    <li>{{plate.description}}</li> 
    <li>{{plate.price}}</li> 
</ul> 

Answer 1

Dylan is right. Вы перепутали свои пространства имен на своем заводе. Получите надлежащие объекты и поместите их в область видимости.

working plunkr of your factory

app.factory('Plate', function(){ 

    var Plate = function(name, description, price, ingredients){ 
    this.name = name; 
    this.description =description; 
    this.price = price; 
    this.ingredients = ingredients; 
    }; 

    Plate.prototype.toString= function(){ 
    var returnString='' ; 
    returnString += "name" + this.name + "\n" + 
    "description: " + this.description + "\n" + 
    "price: " + this.price + "\n"; 

    return returnString; 
    }; 

    return Plate; 
}) 

app.controller('MainCtrl', function($scope, Plate) { 
    var steakSandwich= new Plate('Steak Sandwich', 'Something nice and tasty', 11.75); 
    var lambShoulderSteak = new Plate('Lamb Shoulder Steak','Something Different', 11.75); 
    var lambChops = new Plate('Lamb Chops', 'why not', 14.75); 
    var chickenSandwich = new Plate('chicken Breast Sandwich', 'basque chicken on a bun',9.75); 
    var basqueBurger = new Plate('Basco Burger', 'a better burger', 9.75); 
    var diner = []; 
    diner.push(steakSandwich, lambShoulderSteak,lambChops,chickenSandwich,basqueBurger); 

    $scope.plates = diner; 

    angular.forEach(diner, function (plate) { 
    console.debug(plate.toString()); 
    }); 

}); 

Checkout консоль, чтобы проверить ToString().

Answer 2

Вы возвращающегося Plate с вашего завода, для этого diner является Plate, он не обладает свойством Plate. Вы должны либо позвонить своему factory «Пластину», либо добавить его прямо, либо вернуть объект с свойством Plate.