각도 항목 동기화 (제품)

Question

제품 목록이 있다고 가정 해 보겠습니다. 우리는 그들을 통해 PHP를 가져옵니다. 예를 들어 :

우리의보기에 그런

$products = Product::all(); 

:

<div class='product' ng-repeat="product in products"> 
    <div class="name">{{ product.name }}</div> 
    <div class="short-info">{{ product.short }}</div> 

    <div class="quantity"> 
     <button class="add-one" ng-click="removeOne(product)">-</button> 
     <input type="text" ng-model="{{ product.quantity }}"> 
     <button class="remove-one" ng-click="addOne(product)">+</button> 
    </div> 
</div> 

하지만 어떻게 우리가 이러한 것들을 함께 작동 할 수있다 : 각도에서

<?php foreach ($products as $product): ?> 
    <div class='product'> 
     <div class="name"><?php echo $product->name ?></div> 
     <div class="short-info"><?php echo $product->short ?></div> 

     <div class="quantity"> 
      <button class="add-one">-</button> 
      <input type="text" value="<?php echo $product->quantity ?>"> 
      <button class="remove-one">+</button> 
     </div> 
    </div> 
<?php endforeach ?> 

우리는 일부는 다음과 같이 생각해야합니다? 을 php (seo puproses)로 즉시 채우고 각도가 제공하는 기능을 갖고 싶습니다.

**EXAMPLE:** 
User navigate to http://.../catalog 
User instantly see product list (because they were rendered with php) 
User instantly can change product amount (here comes angular ng-model) 

어떻게 수행하나요? 감사합니다

Answer 1

당신은

<div class='product' ng-repeat="product in products" ng-init="products=<?php echo json_encode($products);?>"> 
    <div class="name">{{ product.name }}</div> 
    <div class="short-info">{{ product.short }}</div> 

    <div class="quantity"> 
     <button class="add-one" ng-click="removeOne(product)">-</button> 
     <input type="text" ng-model="{{ product.quantity }}"> 
     <button class="remove-one" ng-click="addOne(product)">+</button> 
    </div> 
</div> 

내가 PHP 프로그래머가 아니다 사용할 수 있습니다,하지만 당신은 여기에서 아이디어를 얻을 수 있습니다.