angle-ui-bootstrap(1)



Angular Ui Bootstrap



2019 Unicorn Enterprise Heavy Gold Recruitment Python Engineer Standard >>> hot3.png

###



####、プロジェクトを作成し、新しいページを作成し、demo1.htmlという名前を付けてから、ブートストラップを導入し、angularを導入してから、angular-ui-bootstrapを導入します。具体的な紹介は次のとおりです。

{{alert.msg}} A happy alert! Add Alert

ここでは、cdnを使用して紹介しています。もちろん、ローカルに直接ダウンロードして紹介することもできます。



次のステップは、ページにコンテンツを作成することです。ng-appを小さくすることはできません。問題を回避するために、htmlにng-appを記述します。 ng-app = 'myApp'と記述します。次に、ページにコンテンツを書き込みます。次のように入力します:

var app =angular.module('myApp', ['ui.bootstrap']) app.controller('AlertDemoCtrl', function ($scope) { $scope.alerts = [ { type: 'danger', msg: 'Oh snap! Change a few things up and try submitting again.' }, { type: 'success', msg: 'Well done! You successfully read this important alert message.' } ] $scope.addAlert = function() { $scope.alerts.push({msg: 'Another alert!'}) } $scope.closeAlert = function(index) { $scope.alerts.splice(index, 1) } })

この後に、次のようなjsコ​​ードが続きます。

それから走って、事故がなければ走れると思いますが、特定のスクリーンショットを撮ることはできません。



転載:https://my.oschina.net/shuinian/blog/813477