ประกาศค่าหลายค่าใน ng-init


85

ดังนั้นฉันจึงสงสัยว่าฉันสามารถประกาศค่าหลายค่าภายใน ng-init เดียวได้อย่างไรโดยไม่ต้องสร้างแฮชแปลก ๆ ฉันจึงต้องเข้าถึงโดยเฉพาะเสมอ

โดยพื้นฐานแล้วฉันต้องการ

<div ng-init="a = 1, b = 2">{{a}}</div>

และฉันกำลังบอกว่าฉันต้องการหลีกเลี่ยงที่จะทำ

<div ng-init="unecessary_bs = {a: 1, b: 2}">{{unecessary_bs.a}}</div>

อย่างไรก็ตามความสมเหตุสมผล:

<div ng-init="a = 1, b = 2">{{a}}</div>

ดูเหมือนจะไม่ได้ผล

ขอบคุณที่คาดหวัง


"a = 1, b = 2"จะไม่สมเหตุสมผลเนื่องจากจาวาสคริปต์และอัฒภาคเป็นสิ่งที่แยกข้อความ แต่ความคิดนั้นเหมือนกัน
Bernardo Dal Corno

คำตอบ:


144

ใช้ฟังก์ชันวิธีที่อ่านง่ายขึ้น:

ng-init="init()"

และ:

$scope.init = function() {
    $scope.a = 1;
    $scope.b = 2;
}

หรือถ้าคุณต้องแยกตัวแปรอินไลน์ด้วยอัฒภาค:

ng-init="a = 1; b = 2"

7
สิ่งนี้จะใช้ไม่ได้กับ ng-repeat เนื่องจากมีขอบเขตของตัวเองโปรดดูjsfiddle.net/U3pVM/13212
Toolkit

@Toolkit ใช้สัญกรณ์จุด (ไวยากรณ์ controllerAs) เพื่ออ้างอิงฟังก์ชันนอกขอบเขตการแยกของ ng-repeat ส่งผ่าน $ index var ที่กำหนดไว้ล่วงหน้าของ ng-repeat ไปยังฟังก์ชันที่เรียกจากมุมมอง
trickpatty

การประเมินเริ่มจากด้านใด ตัวอย่างเช่นถ้าฉันต้องการใช้ตัวแปรในคำสั่งอื่นฉันจะเขียนคำสั่งของฉันได้อย่างไร? เช่น ng-init = "a = 12; b = 1 + a" หรือ init = "b = 1 + a; a = 12;"? มันประเมินจากด้านซ้ายเป็นจาวาสคริปต์หรือไม่?
Pooya

@ Пуя - ฉันจะถือว่าอย่างนั้น คุณสามารถทดสอบได้: ng-init="c = a + b; a = 1; b = 2"และดูว่าผลลัพธ์ของcมันคืออะไร - ให้เดาให้ดีที่สุดจากซ้ายไปขวา
tymeJV

39

บางครั้งมันไม่เหมาะที่จะใส่ตัวแปรในฟังก์ชัน ตัวอย่างเช่นแบ็กเอนด์ของคุณเป็นแบบด่วนและคุณกำลังแสดงไฟล์โดยใช้หยก

ด้วย Express.js คุณสามารถส่งตัวแปรภายในไปยัง html Angular สามารถรับตัวแปรเหล่านี้ด้วย

ng-init=""

ใช้ ";" หนึ่งสามารถมีหลายตัวแปร

ตัวอย่าง

ng-init=" hello='world'; john='doe' "  


3
 <div ng-app="app">
  <div ng-controller="TodoCtrl">
    <ul>
      <li ng-repeat="todo in todos" ng-init='initTodo = init(todo)'>
        <span class="done-{{todo.done}}">{{todo.text}} |
                               and todo.text via init:{{initTodo}}</span>
      </li>
    </ul>

  </div>

และ

  var modulse = angular.module("app",[]);

  modulse.controller("TodoCtrl", function ($scope)  {

            $scope.todos = [ {text:'todo1'}, {text:'todo2'}]; 

            $scope.init = function (todo) {  return todo.text; };

  });
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.