标签: ng-tags-input

ng-tags-input,将标签数据存储为字符串数组

我正在使用ng-tags输入,填充行后得到的数据是一个对象数组,每个都有一个'text'字符串字段,如此

[{"text":"egon"},{"text":"peter"},{"text":"raymond"},{"text":"winston"}]

有没有办法将数据存储为字符串数组?喜欢

["egon", "peter", "raymond", "winston"]
Run Code Online (Sandbox Code Playgroud)

angularjs ng-tags-input

17
推荐指数
1
解决办法
8078
查看次数

ngTagsInput"ngrepeat:dupes"和"无法读取属性'替换'未定义"

我试图在ngTagsInput中使用自动完成,我收到以下错误:

Error: [ngRepeat:dupes] http://errors.angularjs.org/1.2.9/ngRepeat/dupes?p0=item%20in%20suggestionList.items%20track%20by%20track(item)&p1=undefined
    at Error (native)
Run Code Online (Sandbox Code Playgroud)

要么

TypeError: Cannot read property 'replace' of undefined
    at j (https://localhost:3000/js/plugins/ng-tags-input.min.js:1:5556)
Run Code Online (Sandbox Code Playgroud)

我已经检查了几次,我的查询功能正在返回一个正确的标签数组,而且确实如此.它工作得很漂亮.标签的结构如下所示:

{ 
name: String, 
_id: ObjectId, 
__v: Number, 
active: Boolean, 
display: Boolean, 
createDate: Date
}
Run Code Online (Sandbox Code Playgroud)

我的HTML看起来像:

<tags-input
    ng-model="tags"
    displayProperty="name"
    placeholder="Add a tag">
    <auto-complete source="loadTags($query)"></auto-complete>
</tags-input>
Run Code Online (Sandbox Code Playgroud)

而我的loadTags函数是:

$scope.loadTags = function(query) {

    return $http.get(configService.getApi() + '/tags?conditions=' + urlEncodeObject({name: { $regex: query }}), {
        headers: {
            'x-auth-token': sessionService.getToken()
        }
    });
};
Run Code Online (Sandbox Code Playgroud)

angularjs ng-tags-input

8
推荐指数
2
解决办法
2749
查看次数

使 ngTags 可滚动

谁能告诉我如何使 ng-input-tag(Angular) 在 X 方向可滚动。目前,如果我插入标签,则 div 的高度会增加。我想要的是,如果我继续插入标签,那么它应该沿 X 方向滚动

我尝试过:宽度:自动;高度:34px;溢出-x:自动;溢出-y:隐藏;空白:nowrap;但它没有按预期工作

所以让我知道我错在哪里。

ng-tags-input

5
推荐指数
1
解决办法
2145
查看次数

ng标签输入不允许在文本框中输入两次相同的文本

如果自动完成带来相同文本的结果,我正在使用ng-tags输入进行自动完成,例如:当我输入"R","Rob","Rob"时,会填充两个结果.

我点击了一个"Rob",它现在在文本框中,但是当我再次键入"R"时,"Rob"不会出现.如何为列表中的每个项目提供唯一性.

javascript angularjs angularjs-ng-repeat ng-tags-input

5
推荐指数
1
解决办法
873
查看次数

“错误:无法更改类型属性”。使用 ngTagInput 库 (AngularJs) 时出现错误

我在使用 ngTagInput 库时遇到奇怪的错误:

错误:无法更改类型属性。

这是该错误的屏幕截图 - Error Screenshot

HTML 代码 -

<html ng-app="project">
 <head>
  <link href="/css/ng-tags-input.bootstrap.min.css" rel="stylesheet"/>
  <link href="/css/ng-tags-input.min.css" rel="stylesheet" />
  <script type="text/javascript"  src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js'></script> 
  <script type="text/javascript" src="/assets/bootstrap-3.2.0-dist/js/bootstrap.min.js"></script>
  <script type="text/javascript" src='/js/angular.min.js'></script>  
  <script src="/js/ng-tags-input.min.js"></script>
  <script src="/js/app.js"></script>
 </head>
<body>
<form ng-controller="MainCtrl" role="form">
 <div class="col-md-12 topM10px">
    <tags-input ng-model="formInfo.tags" placeholder="Add a keyword"></tags-input>        
 </div> 

 <div class="col-md-12 topM10px">
    <div ng-click="submitidea()" class="col-md-3 submitbtn">Submit</div>      
 </div> 

</form>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

控制器代码(app.js)-

var app = angular.module('project', ['ngTagsInput']);

app.controller('MainCtrl', function($scope, $http) {
   $scope.formInfo = {};
   $scope.tags = [
     { text: 'Tag1' }, …
Run Code Online (Sandbox Code Playgroud)

angularjs ng-tags-input

5
推荐指数
1
解决办法
2868
查看次数

ngTagsInput-选择标签后关闭自动完成列表

我将ngTagsInput指令设置如下:

 <tags-input ng-model="controller.myTags" 
   replace-spaces-with-dashes="false">
   <auto-complete source="loadTags($query)"
     min-length="0"
     load-on-empty="true"
     load-on-focus="true">
   </auto-complete>
 </tags-input>
Run Code Online (Sandbox Code Playgroud)

只要用户选择合适的输入区域,就会显示自动完成列表。但是,只要用户从自动完成列表中选择标签,我希望该列表隐藏。当前,用户选择标签后,列表仍会显示。

如果我删除了空载,则只要输入中的焦点对准,列表就不会显示。

jquery angularjs cordova angularjs-directive ng-tags-input

5
推荐指数
0
解决办法
341
查看次数

标签 角材料中的输入抛出错误,chipInput 不存在

我试图将 mat-chips 放入我的代码中,引发错误

<mat-form-field class="example-chip-list" appearance="fill">
                                <mat-label>Favorite Fruits</mat-label>
                                <mat-chip-list #chipList aria-label="Fruit selection">
                                  <mat-chip
                                    *ngFor="let fruit of fruits"
                                    [selectable]="selectable"
                                    [removable]="removable"
                                    (removed)="remove(fruit)">
                                    {{fruit}}
                                    <mat-icon matChipRemove *ngIf="removable">cancel</mat-icon>
                                  </mat-chip>
                                  <input
                                    placeholder="New fruit..."
                                    #fruitInput
                                    [formControl]="fruitCtrl"
                                    [matAutocomplete]="auto"
                                    [matChipInputFor]="chipList"
                                    [matChipInputSeparatorKeyCodes]="separatorKeysCodes"
                                    (matChipInputTokenEnd)="add($event)">
                                </mat-chip-list>
                                <mat-autocomplete #auto="matAutocomplete" (optionSelected)="selected($event)">
                                  <mat-option *ngFor="let fruit of filteredFruits | async" [value]="fruit">
                                    {{fruit}}
                                  </mat-option>
                                </mat-autocomplete>
                              </mat-form-field>
Run Code Online (Sandbox Code Playgroud)

在组件.ts中

selectable = true;
  removable = true;
  separatorKeysCodes: number[] = [ENTER, COMMA];
  fruitCtrl = new FormControl();
  filteredFruits: Observable<string[]>;
  fruits: string[] = ['Lemon'];
  allFruits: string[] = ['Apple', 'Lemon', 'Lime', 'Orange', 'Strawberry']; …
Run Code Online (Sandbox Code Playgroud)

ng-tags-input angular-material

5
推荐指数
2
解决办法
5036
查看次数

设置addFromAutocompleteOnly时,剩余文本将保留在输入字段中

我正在使用ng-tags标签 - 输入如下:

<tags-input ng-model="Tags" placeholder="Add" add-from-autocomplete-only="true">
    <auto-complete source="loadTags($query)"></auto-complete>
</tags-input>
Run Code Online (Sandbox Code Playgroud)

当标签输入字段失去控制时,我希望任何剩余的文本消失.我想使用allowLeftoverText属性来实现这一点,但是当使用addFromAutocompleteOnly时,文档说它被忽略了.

javascript angularjs ng-tags-input

4
推荐指数
1
解决办法
993
查看次数

如何更改ng-tags-input separator?(默认:破折号)

添加空格分隔的标记时,ng-tags-input将用短划线替换空格.我怎样才能保留空格字符呢?

angularjs ng-tags-input

4
推荐指数
1
解决办法
1897
查看次数

ngTagsInput - 只允许选择自动完成建议?

如果你是从一个来源拉

[{text:'a'},{text:'ab'},{text:'abc'}]

并且用户输入'abcd',你如何阻止用户创建'abcd'标签?

angularjs ng-tags-input

4
推荐指数
1
解决办法
1667
查看次数