Angularjs使用范围值呈现视图

时间:2016-06-29 14:00:00

标签: javascript angularjs http

我有这样的观点:

  <div ng-show="">
<div style='background-color: #13a4d6; border-color: #0F82A8'>
    {{headerdescription}}
    <div style='float: right'>{{price}} $</div>
</div>
<div style=' width: 60%; float: left;'>
    <div style='padding: 10px;margin-top: 10px;'>{{description}}</div>
    <div style='padding: 10px;margin-top: 10px;'>{{softvalues}}</div>
</div>
<div style='float: right; margin-top: 10px;'>
    <img src='data:image/png;base64,{{image}}'>
</div>

我希望我的角度代码能够在设置范围值的情况下获得此视图。

我试过了:

  $scope.headerdescription = "YEEES";
                    $http.get('App_JsQuote/directives/door.html').success(function (html) {
                        console.log(html);
                    });

但问题是未设置范围值,因此视图变得像以前一样。如何设置范围值,然后获取应包含所有数据的视图?

2 个答案:

答案 0 :(得分:0)

我不确定,但你能尝试这样的事吗?

public class Model extends Observable<Change> {

    private Set<Player> players;
    private Player currentPlayer;

    public Model() {
        players = new HashSet<Player>();
    }

    public void addPlayer(Player player) {
        currentPlayer = player;
        this.players.add(player);
    }

    public Set<Player> getPlayers() {
        return Collections.unmodifiableSet(this.players);
    }

    public Player getCurrentPlayer() {
        return currentPlayer;
    }

    public void setCurrentPlayer(Player currentPlayer) {
        this.currentPlayer = currentPlayer;
    }

}

public void changePlayer(Model game) {
    Player player2 = new Player(0);//the id in this case is 0

    //this is the part of the code where i create a list using the set
    List<Player> playersList = new ArrayList<Player>(game.getPlayers());

    for (int i = 0; i < playersList.size(); i++) {
        ... // some code that will set player2 by player2 = playersList.get(i)
    }

    // change the current player for the game
    game.setCurrentPlayer(player2);
}

答案 1 :(得分:0)

您可能需要在控制器中全局使用ngCloak指令,或在元素中使用ngBind指令。如果您需要创建媒体或链接uri,则需要使用$sce服务。

示例:

<div ng-show="">
    <div style='background-color: #13a4d6; border-color: #0F82A8'>
        <span ng-bind="headerdescription"></span>
    <div style='float: right' ng-bind="price + '$'"></div>
</div>
<div style=' width: 60%; float: left;'>
   <div style='padding: 10px;margin-top: 10px;' ng-bind="description"></div>
    <div style='padding: 10px;margin-top: 10px;' ng-bind="softvalues"></div>
</div>
<div style='float: right; margin-top: 10px;'>
    <img ng-src='url'>
</div>

在您的JS文件中,您需要使用$ sce来过滤并生成url var。

示例:

$scope.url = $sce.trustAsResourceUrl('data:image/png;base64,' + $scope.image);