Javascript 从角度动态创建HTML按钮

我做了一些研究，但找不到任何教程或示例。所以我想我会把这个放出来让别人回答

我试图在angular中创建按钮，以在html中显示。我没有太多的代码，但我有：

angular.module（'starter.controllers'，['ionic']））
.controller（'HomeCtrl'，函数（$ionicPopup，$scope）{
}

组

这听起来像是基本的角度功能。您首先必须定义一些

$scope

数据：

.controller('HomeCtrl', function($ionicPopup, $scope) {
    // or whatever information your contacts have
    $scope.contacts = [];

    // the code that picks a contact
    //..
    navigator.contacts.pickContact(function(contact) {
        $scope.contacts.push(contact);
    })

    $scope.doSomethingWithContact = function(contact) {
        console.log(contact);
    }
}

然后在您的html中：

<button class="button button-block"
        ng-repeat="contact in contacts"
        ng-click="doSomethingWithContact(contact)">
    {{ contact.displayName }} (phone: {{ contact.phoneNumbers[0] }})
</button>

{{contact.displayName}（电话：{{contact.phoneNumbers[0]}）

在控制器的代码中，您需要创建一个按钮集合并将其分配给作用域。然后在HTML中使用

ngRepeat

指令迭代该集合并创建所需的按钮。有关示例，请参阅下面的代码

---

根据什么数据和标准动态创建？根本不清楚你在问什么为什么需要动态添加，你可以使用

ng hide

，

ng show

，

ng if

如果你想有条件地隐藏/显示/渲染DOM中的按钮问题需要更多细节，我想到的唯一想法是在控制器端添加一个ng repeat和一个对象，其中包含按钮的名称或任何其他属性，但目的是什么？我只需要能够创建按钮，而无需每次向html添加代码。这意味着，当用户在应用程序内创建一个对象时，它将使用他们提供的信息创建一个按钮。如果不是动态的我为我的误解感到抱歉我添加了一个编辑来帮助解释我的情况。好的，我和你做的完全一样。因为它很完美。但是由于某种原因，按钮没有显示出来。我不知道出了什么问题。有什么帮助吗？你是否验证了联系人确实被添加到

$scope.contacts

？是的。i console.log（$scope.contacts）在将contact推到它上面之后。我得到，[object object object]您可能需要触发一个角度摘要循环，因为

navigator

对象不是角度的：

$scope.$apply（function（）{$scope.contacts.push（contact）；

修复了它。谢谢。现在开始工作！