如何使徽章在這樣的堆棧溢出標籤的輸入引導

我想輸入/ textarea的，可允許用戶添加引導badges。當用戶按下空格鍵後，會添加一個新的badge，就像SO標籤字段一樣（請參見截圖）。此外，每個badge都必須包含一個x圖標，該圖標在按下時會刪除該特定的badge。如何通過bootstrap實現這一點？

來源

2017-08-07 SKG

使用此https://bootstrap-tagsinput.github.io/bootstrap-tagsinput/examples/。檢查此codepen以及https://codepen.io/nsei/pen/zqJEOy?editors=1100 – Shiladitya

@Shiladitya謝謝，但我已經知道這一點。有沒有可能實現它沒有JQuery？我正在使用angular4，並希望儘可能避免使用JQuery。 – SKG

這裏你去http://mbenford.github.io/ngTagsInput/ – Shiladitya

從下面GitHub的鏈接下載CSS文件 ng-tags-input.min和ng-tags-input 和創建像下面的控制器。

> <body ng-controller="MainCtrl"> 
>  <tags-input ng-model="tags"></tags-input> 
>  <p>Model: {{tags}}</p> </body>

下面添加在App.js

app.controller('MainCtrl', function($scope, $http) { 
    $scope.tags = [ 
    { text: 'Tag1' }, 
    { text: 'Tag2' }, 
    { text: 'Tag3' } 
    ]; 
});

來源：Demo

來源

2017-08-07 10:37:44 teja

我正在使用angular4。任何angular4特定解決方案？ – SKG

如何使徽章在這樣的堆棧溢出標籤的輸入引導

回答

相關問題