美文网首页我爱编程
2018-02-07 Ztree函数、问题、AugularJS-

2018-02-07 Ztree函数、问题、AugularJS-

作者: 胡諾 | 来源:发表于2018-02-08 13:15 被阅读0次

    第一组:姚成栋 Ztree基础

    1. 如果ztree要调用函数,如调用某个方法,需要在setting进行配置,如
    
    function zTreeOnClick(event, treeId, treeNode) {
       };
    var setting = {
        callback: {
            onClick: zTreeOnClick
        }
    };
    
    1. 比如,在页面上点击树节点后显示其名称相同的数据,


      image.png

      代码如下:

      //获取树形结构
            var zTreeObj;
            // zTree 的参数配置,深入使用请参考 API 文档(setting 配置详解)
            var setting = {
                callback: {
                    onClick: zTreeOnClick
                }
            };
            // zTree 的数据属性,深入使用请参考 API 文档(zTreeNode 节点数据详解)
            var zNodes = [
            //数据
            ];
            $(document).ready(function () {
                zTreeObj = $.fn.zTree.init($("#Typetree"), setting, zNodes);
            });
        }
    
    1. 当然别忘记一开始要加载树
     //获取树形结构
            var zTreeObj;
    $(document).ready(function () {
                zTreeObj = $.fn.zTree.init($("#Typetree"), setting, zNodes);
            });
    
    

    第二组:赵彩凤

    问题:
    AngularJS 日期控件-年度选择 怎么给默认值?

    image.png
    目前给日期控件 placeholder="{{year}}",js获取当前年..仅显示
    后台处理:若传过来日期为空,则按当前年查询
    问如何给年度时间控件默认值?

    第三组:蔡永坚 AugularJS-功能介绍1

    数据绑定

    AngularJS的双向数据绑定,意味着你可以在Mode(JS)中改变数据,而这些变动立刻就会自动出现在View上,反之亦然。即:一方面可以做到model变化驱动了DOM中元素变化,另一方面也可以做到DOM元素的变化也会影响到Model。
    从View到Controller再到View的数据交互(例01):

    <html ng-app="demoApp">
    
    ……
    
    <input type="text" ng-model="user.name" placeholder="请输入名称"/>
    
    Hello, {{ user.name }}!
    
    

    关键: ng-app 、 ng-model 和 { {user.name } }

    首先: <html>元素的ng-app属性。标识这个DOM里面的内容将启用AngularJS应用。

    其次:告诉AngularJS,对页面上的“user.name” 这个Model进行双向数据绑定。

    第三:告诉AngularJS,在“{{ user.name}}”这个指令模版上显示“user.name”这个Model的数据。

    scopes、module、controller
    scopes

    $scope是一个把view(一个DOM元素)连结到controller上的对象。在我们的MVC结构里,这个 $scope 将成为model,它提供一个绑定到DOM元素(以及其子元素)上的excecution context。

    尽管听起来有点复杂,但 $scope 实际上就是一个JavaScript对象,controller和view都可以访问它,所以我们可以利用它在两者间传递信息。在这个 $scope 对象里,我们既存储数据,又存储将要运行在view上的函数。

    每一个Angular应用都会有一个 $rootScope。这个 $rootScope 是最顶级的scope,它对应着含有 ng-app 指令属性的那个DOM元素。

    app.run(function($rootScope) { $rootScope.name = "张三"; });

    如果页面上没有明确设定 $scope ,Angular 就会把数据和函数都绑定到这里, 第一部分中的例子就是靠这一点成功运行的。

    这样,我们就可以在view的任何地方访问这个name属性,使用模版表达式{{}},像这样:{{ name }}

    module

    首先需要明确一下模板的概念。在我还不知道有模板这个东西的时候,曾经用js拼接出很长的HTML字符串,然后append到页面中,这种方式想想真是又土又笨。后来又看到可以把HTML代码包裹在一个<script>标签中当作模板,然后按需要取来使用。

    在ng中,模板十分简单,它就是我们页面上的HTML代码,不需要附加任何额外的东西。在模板中可以使用各种指令来增强它的功能,这些指令可以让你把模板和数据巧妙的绑定起来。

    在<html>标签上多了一个属性ng-app=”MyApp”,它的作用就是用来指定ng的作用域是在<html>标签以内部分。在js中,我们调用angular对象的module方法来声明一个模块,模块的名字和ng-app的值对应。这样声明一下就可以让ng运行起来了。

    ng-controller

    要明确创建一个$scope 对象,我们就要给DOM元素安上一个controller对象,使用的是ng-controller 指令属性:

    <div ng-controller="MyController"> {{ person.name }} </div>  
    

    ng-controller指令给所在的DOM元素创建了一个新的$scope 对象,并将这个$scope 对象包含进外层DOM元素的$scope 对象里。在上面的例子里,这个外层DOM元素的$scope 对象,就是$rootScope 对象。这个scope链是这样的:

    所有scope都遵循原型继承(prototypal inheritance),这意味着它们都能访问父scope们。对任何属性和方法,如果AngularJS在当前scope上找不到,就会到父 scope上去找,如果在父scope上也没找到,就会继续向上回溯,一直到$rootScope 上。即如果controller是多层嵌套的,就会从最里面一直往外找,这个scope链是这样的:
    唯一的例外:有些指令属性可以选择性地创建一个独立的scope,让这个scope不继承它的父scope们,这个会在指令详解中说明。


    第四组:张元一 Pygame编写游戏《外星人入侵》

    一. 创建pygame窗口,游戏基本结构如下:

    alien_invasion.py

    import sys
    import pygame
    def run_game():
        pygame.init()
        screen = pygame.display.set_mode((ai_settings.screen_width,ai_settings.screen_height))
        pygame.display.set_caption("AlienInvasion")
    
        #主循环
        while True: #让最近绘制的屏幕可见
            pygame.display.flip()
    run_game()
    

    将创建一个空的Pygame窗口

    二. 创建设置类

    settings.py

    import random
    
    class Settings():
        def __init__(self):
            self.screen_width = 1000
            self.screen_height = 600
            self.bg_color = (255,255,255)
    
    
            self.bullet_width = 3
            self.bullet_height = 15
            self.bullet_color = random.randint(0,256),random.randint(0,256),random.randint(0,256)
            self.bullets_allowed = 1000
    
            self.speedup_scale = 2
            self.score_scale = 2
            self.initialize_dynamic_settings()
    
            self.ship_limit = 3
    
    
        def initialize_dynamic_settings(self):
            self.ship_speed_factor = 20
            self.bullet_speed_factor = 4
            self.alien_speed_factor = 10
            self.fleet_drop_speed = 5
    
            #1表示向右,-1表示向左
            self.fleet_direction = 1
            #
            self.alien_points1 = 10
    
        def increase_speed(self):
            self.bullet_speed_factor *= self.speedup_scale
            self.alien_speed_factor *= self.speedup_scale
            self.fleet_drop_speed *= self.speedup_scale
            self.alien_points1 *= self.score_scale
    

    在修改游戏时,只需要修改此文件的一些值,无需查找散布在文件中的不同配置。


    第五组:陈孚楠 设计模式

    3、 抽象工厂模式

    抽象工厂模式是所有形态的工厂模式中最为抽象和最具一般性的一种形态。抽象工厂模式是指当有多个抽象角色时,使用的一种工厂模式。抽象工厂模式可以向客户端提供一个接口,使客户端在不必指定产品的具体的情况下,创建多个产品族中的产品对象。根据里氏替换原则,任何接受父类型的地方,都应当能够接受子类型。因此,实际上系统所需要的,仅仅是类型与这些抽象产品角色相同的一些实例,而不是这些抽象产品的实例。换言之,也就是这些抽象产品的具体子类的实例。工厂类负责创建抽象产品的具体子类的实例。

    为创建一组相关或相互依赖的对象提供一个接口,而且无需指定他们的具体类。

    这里不再举例,主要在于抽象工厂与工厂模式的区别:
    简单的说,抽象工厂是对简单工厂(工厂方法模式、工厂模式)中的工厂类进一步抽象成接口,解决了工厂方法中的硬编码问题,因为以后如有新增新的对象,只要再实现一个对应的工厂类,就完成了扩展。无需修改以前的代码。普通工厂产出是一个产品(实例),抽象工厂产出是一个抽象(接口)。区别在于,若添加一个新的产品,前者是修改工厂,后者是创建新工厂(符合“闭合原则”)。

    抽象工厂的优点/缺点:

    优点:

    抽象工厂模式隔离了具体类的生产,使得客户并不需要知道什么被创建。
    当一个产品族中的多个对象被设计成一起工作时,它能保证客户端始终只使用同一个产品族中的对象。
    增加新的具体工厂和产品族很方便,无须修改已有系统,符合“开闭原则”。

    缺点:

    增加新的产品等级结构很复杂,需要修改抽象工厂和所有的具体工厂类,对“开闭原则”的支持呈现倾斜性。(不过说这个缺点好像有点吹毛求疵了)

    相关文章

      网友评论

        本文标题:2018-02-07 Ztree函数、问题、AugularJS-

        本文链接:https://www.haomeiwen.com/subject/yhvzzxtx.html