在文本框自动完成文本不添加到表完全 [英] autocompleted text in textbox does not add to table completely

问题描述

我是新来angularjs，

I am new to angularjs,

我有一个文本框和我有一个按钮和表：

I have a textbox and I have a button and table:

每当用户点击添加按钮，在文本框中的数据将被添加到表：
这里是链接到我的code：
code

whenever user click on add button the data in the textbox would be added to the table: here is the link to my code: code

一切工作正常，但是当涉及到​​自动完成它开始演戏搞笑，
自动完成itselfe工作正常，但例如，如果添加ACTI，并自动完成建议动作那么，如果不是写你suggestins选择它整个单词的您键入将增加，例如在这个例子只是他字ACTI，而不是动作。

everything works fine, but when it comes to autocomplete it starts acting funny, the autocomplete itselfe works fine but if for example add acti and the autocomplete suggests actionscript then if instead of writing the whole word you choose it from suggestins just he characters that you typed would be added, for example in this example acti instead of actionscript.

也在这里是我的code：

also here is my code:

<script>
var app = angular.module('app', []);
app.factory('Service', function() {
    var typesHash = [ {
        id :1,
        name : 'lemon',
        price : 100,
        unit : 2.5
    }, {
        id : 2,
        name : 'meat',
        price : 200,
        unit : 3.3
    } ];

    var localId = 3;
    availableTags = [
                      "ActionScript",
                      "AppleScript",
                      "Asp",
                      "BASIC",
                      "C",
                      "C++",
                      "Clojure",
                      "COBOL",
                      "ColdFusion",
                      "Erlang",
                      "Fortran",
                      "Groovy",
                      "Haskell",
                      "Java",
                      "JavaScript",
                      "Lisp",
                      "Perl",
                      "PHP",
                      "Python",
                      "Ruby",
                      "Scala",
                      "Scheme"
                    ];
    var service = {
        addTable : addTable,
        getData : getData,
        complete:complete


    };
    return service;
    function complete(){
        $( "#txt" ).autocomplete({
          source: availableTags,
          messages: {
              noResults: '',
              results: function() {}
          }
        });
        } 
    function addTable(name,price) {
        typesHash.push({id:localId++, name:name, price:price,unit:1});
    }
    function getData() {
        return typesHash;
    }
});
app.controller('table', function(Service) {
    //get the return data from getData funtion in factory
    this.typesHash = Service.getData();
    //get the addtable function from factory 
    this.addTable = Service.addTable;
    this.complete=Service.complete;
});
</script>

谁能帮助？
（还值得注意的是，这是我的项目的一个较小的版本，出于某种原因，我用厂）

can anyone help? (also it is noteworthy that this is a smaller version of my project and for some reason I used factory)

更新：

的一种方法是使用

  typesHash.push({id:localId++, name:$("#txt").val(), price:price,unit:1});

而不是：

  typesHash.push({id:localId++, name:name, price:price,unit:1});

但我相信有一个更好的办法...任何想法？

But I am sure there is a better way... Any idea?

推荐答案

嘿对不起哈米德Minaee我有点晚，但这里是解决方案为您提供： -

Hey sorry Hamed Minaee I am little late but here is the solution for you :-

您需要添加

    $("#txt" ).on( "autocompleteselect", function( event, ui ) {
     $scope.tableTools.inputData=ui.item.value;
    } );

和记得 $范围传递给服务通过服务控制器选择更新。

And remember to pass $scope to the service for controller updation by service.

Plunker你 http://plnkr.co/edit/RqTDNRHpUicmFPsYsQR9?p= preVIEW

这篇关于在文本框自动完成文本不添加到表完全的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！