Question

我有两个清单：

列出alredy现有城市
列表，我可以将新城市添加到我的第一个列表中。

如果我输入名称就可以了，它会在第一个列表中创建新项目。我想要丰富的是通过点击第二个列表中的元素将城市添加到第一个列表（首先检查一个城市，然后通过按下按钮确认操作）。试图通过jQuery获取被点击元素的名称并将其输入到输入中，以便能够在下一步确认添加。

$(document).on('click', '.city', function () {
    var input = $('.city-input'),
        inputValue = input.val();
    input.val($(this).text());
    return false;
});

它取名字，并将此名称放入输入中。但是，当我按下按钮时 - 它只会创建空元素......

如果我输入了某些内容，则按下按钮 - 它会创建一个元素。然后，如果我按下第二个列表中的任何一个城市 - 它会出现在输入字段中，但在我按下确认按钮后，它会创建一个包含以前键入文本的元素...

另外，我试图创建指令，但这仍然无效..

addCityApp.directive('searchList', function() {
    return {
        scope: {
            searchModel: '=model'
        },
        link: function(scope, element, attrs) {
            element.on('click', attrs.searchList, function(){
                scope.searchModel = $(this).text();
                scope.$apply();
            });
        }
    };
});

这是我的DEMO

Answer 1

我只会使用angular并设置模型，这是我的例子：http://jsfiddle.net/yxtwhos6/16/

$scope.ultiCTRL = { selectedCity: '' };

Answer 2

我已使用纯角度修改了您的代码，以下是代码：http://jsfiddle.net/yxtwhos6/25/

$scope.setCity = function(city) { $scope.newItemName = city;};

我尝试尽可能少地更改您的代码。

在列表中添加元素和从列表中删除元素（AngularJS）

2 个答案: