想象一下，我们有一些产品列表。我们通过 php 获取它们。例如：
$products = Product::all();
那么在我们看来：
<?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 ?>
在角度中，我们会有一些这样的想法：
<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（用于 seo puproses）填充products并具有 angular 提供的功能。
**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)
怎么做？谢谢
您可以使用
<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程序员，但你可以在这里得到想法。