AngularJS толкает значение ввода в массив и затем отображает его - PullRequest
Новая
       1

AngularJS толкает значение ввода в массив и затем отображает его

0 голосов
/ 10 ноября 2018

У меня есть const = info ['вот моя информация, которую я отображаю с помощью ng-repeat']; Затем у меня есть вход и кнопка сохранения. Итак, как я могу нажать на кнопку, сохранить push-значение, которое я набрал внутри ввода, чтобы отобразить его после?

app.html 

<body ng-app="postsWall">
    <div ng-controller="feedsListController">
        <h1>POSTS WALL</h1>
        <label>
            <input type="text" placeholder="Search by title..." ng-model="searchText">      
        <ul>
            <li ng-repeat="feed in feeds | filter:searchText">
                <span>{{ feed.author }}</span>
                <h3>{{ feed.title }}</h3>
                <p>{{ feed.text }}</p>
            </li>
        </ul>
    </label>
    <div ng-show="newPostForm">
        <label>
            <input type="text">
            <input type="text">
            <button ng-click="addPost">Save</button>
            <button>Cancel</button>
        </label>
    </div>`enter code here`
    <button ng-click="showFunc()">Add new post</button>
    </div>

app.controller.js 

const postsWall = angular.module('postsWall', []);

postsWall.controller('feedsListController', function feedsListController($scope) {
    $scope.feeds = info;
    $scope.newPostForm = false;
    $scope.showFunc = function(){
        $scope.newPostForm = !$scope.newPostForm;
    }
    $scope.addPost = function(){

    }
})

1 Ответ

0 голосов
/ 10 ноября 2018

сначала добавьте объект для нового канала, а затем добавьте его в массив каналов в функции addPost () 

postsWall.controller('feedsListController', function feedsListController($scope) {
$scope.newFeed = {};
$scope.feeds = info;
$scope.newPostForm = false;
$scope.showFunc = function () {
    $scope.newPostForm = !$scope.newPostForm;
}
$scope.addPost = function () {
    if ($scope.newFeed!=null) {
        $scope.feeds.push($scope.newFeed);
        $scope.newFeed = {};
    }
}
}

в HTML-коде вы должны привязать входные значения к новому объекту 

<body ng-app="postsWall">
    <div ng-controller="feedsListController">
        <h1>POSTS WALL</h1>
        <label>
            <input type="text" placeholder="Search by title..." ng-model="searchText">      
        <ul>
            <li ng-repeat="feed in feeds | filter:searchText">
                <span>{{ feed.author }}</span>
                <h3>{{ feed.title }}</h3>
                <p>{{ feed.text }}</p>
            </li>
        </ul>
    </label>
    <div ng-show="newPostForm">
        <label>
            <input type="text" ng-model="newFeed.title">
            <input type="text" ng-model="newFeed.text">
            <button ng-click="addPost">Save</button>
            <button>Cancel</button>
        </label>
    </div>`enter code here`
    <button ng-click="showFunc()">Add new post</button>
    </div>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...