ак разрешить цвет фона приложени¤ смены приложений в ионном

 ак разрешить цвет приложени¤ смены приложений в ионном режиме с помощью углового. EG, ¤ хочу создать кнопку, котора¤, когда она будет нажата, должна привести к выпадению цветов, а когда выбран цвет, он должен изменить цвет фона приложени¤

javascript,angularjs,ionic-framework,

1

Ответов: 1

0

¬ы можете использовать $ionicPopup.

ƒобавьте ng-click="selectTheme()"к своей кнопке и объ¤вите ее так:

.controller('yourCtrl', function($scope, $ionicPopup) {
    $scope.selectTheme = function() {
        $ionicPopup.show({
            title: 'Select Theme',
            templateUrl: 'templates/select-theme.html',
            scope: $scope,
            buttons: [{ text: 'Ok' }],
        });
    });
    $scope.themes = [
        { name: 'Theme 1', color: '#f00' },
        { name: 'Theme 2', color: '#0f0' },
        { name: 'Theme 3', color: '#00f' },
        { name: 'Theme 4', color: '#ff0' },
        { name: 'Theme 5', color: '#0ff' },
    ];
    $scope.changeTheme = function (theme) {
        $scope.bgColor = theme;
    };
    $scope.bgColor = $scope.themes[0]; // initial theme
})

«атем вы можете создать список дл¤ выбора цветов в templates/select-theme.html:

<div class="list card">
    <div class="item" ng-repeat="theme in themes" ng-click="changeTheme(theme)">
        <div class="color-ball" style="background-color:{{theme.color}}"></div>
        <h2 ng-bind="theme.name"></h2>
        <p ng-if="theme === bgColor">(Selected)</p>
    </div>
</div>

» добавьте свои стили:

.color-ball {
    width: 50px;
    height: 50px;
    border-radius: 100%;
}

«атем вам просто нужно установить style="background-color:{{bgColor.color}}"в свой <body>...

Ќадеюсь, поможет.

JavaScript, angularjs, ионно-рамки,
Похожие вопросы
Яндекс.Метрика