Question

我是SPA新手，我正在学习durandal和微风。最近我将我的解决方案转换为Typescript，我想知道是否有任何好的解决方案可以在服务器上基于EF模型在TypeScript中生成类型化的breeze实体。我发现的只有这篇文章Breeze.js typed entities，但这只是一小段代码，甚至不是真正的项目。我想知道这个问题有更好的解决方案吗？

Answer 1

下面是您可以放入网站以生成打字稿界面定义的页面。页面获取breeze元数据，然后遍历所有类型，并为每种类型输出typescript接口声明。然后可以将此页面的输出粘贴到任何打字稿文件（* .ts）或打字稿定义文件（* .d.ts）中。如果要对接口进行命名空间，请将结果包含在模块声明中：declare module northwind { ... paste interfaces here... }。

在使用页面之前，您需要进行一次编辑：从＆＃34; api / northwind＆＃34;更改实体管理器的控制器网址。无论你的微风控制器的网址是什么。

生成的接口依赖于Knockout.js打字稿定义，您可以在此处获取：https://github.com/borisyankov/DefinitelyTyped/tree/master/knockout/

使用learn.breezejs.com中的northwind示例，此定义生成器页面的输出将如下所示：

export interface Employee extends breeze.Entity {
    FirstName: KnockoutObservable<string>;
    LastName: KnockoutObservable<string>;
}

然后，您可以使用breeze执行查询，并将结果转换为一系列员工，如下所示：

var manager = new breeze.EntityManager('api/northwind');

var query = new breeze.EntityQuery()
    .from("Employees");

manager.executeQuery(query).then(data => {
    // ***cast the results to a strongly typed array of Employee***
    var employees = <Employee[]>data.results;
}).fail(e => {
    alert(e);  
});

下面是定义生成器页面 - 将新的html文件添加到名为＆＃34; definitions.html＆＃34;的项目中，运行项目并导航到该页面。

<html>
<head>
    <title>Typescript Definition Generator</title>
    <style>
        code {
            white-space: pre;
        }
    </style>
    <script src="//code.jquery.com/jquery-2.1.0.min.js"></script>
    <script src="//ajax.aspnetcdn.com/ajax/knockout/knockout-3.0.0.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/q.js/1.0.0/q.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/breezejs/1.4.4/breeze.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            var entityManager = new breeze.EntityManager('api/northwind');
            entityManager.fetchMetadata()
                .then(function () {
                    var html = '',
                        types = entityManager.metadataStore.getEntityTypes(),
                        type,
                        i,
                        j,
                        property,
                        crlf = String.fromCharCode(13),
                        code = document.createElement('code'),
                        script = document.createElement('script');

                    function getJSType(metadataType) {
                        if (/(Int64)|(Int32)|(Int16)|(Byte)|(Decimal)|(Double)|(Single)|(number)/.test(metadataType))
                            return 'number';
                        else if (/(DateTime)|(DateTimeOffset)|(Time)|(Date)/.test(metadataType))
                            return 'Date';
                        else if (/(Boolean)/i.test(metadataType))
                            return 'boolean';
                        return 'string';
                    }

                    for (i = 0; i < types.length; i++) {
                        // type declaration
                        var type = types[i];
                        html += 'export interface ' + type.shortName;

                        // base type
                        html += ' extends ';
                        if (type.hasOwnProperty('baseEntityType')) {
                            html += type.baseEntityType.shortName;
                        } else {
                            html += 'breeze.Entity';
                        }
                        html += ' {' + crlf;

                        // data properties
                        for (j = 0; j < type.dataProperties.length; j++) {
                            property = type.dataProperties[j];
                            if (type.baseEntityType && type.baseEntityType.dataProperties.filter(function (p) { return p.name === property.name; }).length > 0)
                                continue;
                            html += '    ' + property.name;
                            //if (property.isNullable)
                            //    html += '?';
                            html += ': KnockoutObservable&lt;';
                            html += getJSType(property.dataType.name);
                            html += '&gt;; //' + property.dataType.name + crlf;
                        }

                        // navigation properties
                        for (j = 0; j < type.navigationProperties.length; j++) {
                            property = type.navigationProperties[j];
                            if (type.baseEntityType && type.baseEntityType.navigationProperties.filter(function (p) { return p.name === property.name; }).length > 0)
                                continue;
                            html += '    ' + property.name;
                            //if (property.isNullable)
                            //    html += '?';
                            if (property.isScalar)
                                html += ': KnockoutObservable&lt;';
                            else
                                html += ': KnockoutObservableArray&lt;';
                            html += property.entityType.shortName;
                            html += '&gt;;' + crlf;
                        }

                        html += '}' + crlf + crlf;
                    }

                    code.innerHTML = html;

                    $(code).addClass('prettyprint');

                    document.body.appendChild(code);

                    script.setAttribute('src', '//google-code-prettify.googlecode.com/svn/loader/run_prettify.js');
                    document.body.appendChild(script);
                })
                .fail(function (reason) {
                    alert(reason);
                });
        });
    </script>
</head>
<body>
</body>
</html>

Answer 2

我们正在努力解决这个问题，但尚未发布版本，但很快......如果您想加入我们的Beta列表，请通过Breeze@ideablade.com与我们联系。

如何为breeze实体生成typescript接口/定义

2 个答案: