Як встановити ширину div за допомогою стилю ng

Question 1

Я намагаюся динамічно встановити ширину div, ng-styleале це не застосовує стиль. Ось код:

<div style="width: 100%;" id="container_fform" ng-controller="custController">
    <div style="width: 250px;overflow: scroll;">
        <div ng-style="myStyle">&nbsp;</div>
    </div>
</div>

Контролер:

var MyApp = angular.module('MyApp', []);

var custController = MyApp.controller('custController', function ($scope) {
    $scope.myStyle="width:'900px';background:red";

});

Чого мені не вистачає?

Скрипкове посилання: Скрипка

Question 2

Синтаксис ng-styleне зовсім такий. Він приймає словник ключів (імена атрибутів) та значень (значення, яке вони повинні приймати, порожній рядок видаляє їх), а не лише рядок. Я думаю, що ти хочеш це:

<div ng-style="{ 'width' : width, 'background' : bgColor }"></div>

А потім у вашому контролері:

$scope.width = '900px';
$scope.bgColor = 'red';

Це зберігає розділення шаблону та контролера: контролер зберігає семантичні значення, тоді як шаблон відображає їх у правильне ім'я атрибута.

Question 3

ngStyle приймає карту:

$scope.myStyle = {
    "width" : "900px",
    "background" : "red"
};

Fiddle