简体   繁体   中英

How to add an Item to scope AngularJS

I am very new to Angular JS and mongod. I want to be able to push a new ingredient field into this page to the specific drink the the + button is on.

This is my view

My UI

This is my .jade file block content div.container-fluid(ng-controller="DrinkController", ng-init="setDrinks( #{JSON.stringify(drinks)} )") div.row div.col-md-2 div.col-md-8 h1.title Edit Drinks div.row div.col-md-3 b Name div.col-md-3 b Filename div.col-md-1 div.col-md-5 b Ingredients div.row.editRow(ng-repeat="drink in drinks | orderBy: 'name'") form(ng-submit="editDrink(drink)") div.col-md-3 input(value="{{drink.name}}", ng-model="drink.name") div.col-md-3 input(value="{{drink.image}}", ng-model="drink.image") div.col-md-1.text-right a(ng-click="addNewIngredientEd()") + div.col-md-4 div.row(ng-repeat="ingredient in drink.ingredients") div.col-md-7 select.mixers(value="{{ingredient.name}}", ng-model="ingredient.name", ng-options="i for i in ingredientsList") div.col-md-4 input.addForm.ingredient(value="{{ingredient.amount}}", ng-model="ingredient.amount", style="width: 100px;") div.col-md-1 a(ng-click="removeIngredientEdit($index)") - div.col-md-1 button.btn Save

This is my Related JS

$scope.addNewIngredientEd = function () {
$scope.newDrink.ingredients.push({ name: '', amount: 0 });

//alert("Hello! I am an alert box!!");
console.log('Added new ingredient Test ');
};

You want $index , it's part of ng-repeat

addNewIngredientEd($index)

and

$scope.addNewIngredientEd = function ($index) {
   $scope.drinks[$index].ingredients.push(...

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM